锐客网

  1. 首页 > it技术 > >

JS|JS（笔记）

jsjavascript前端

1.为什么学习JS

1.实现动态效果 ? 2.减轻服务器压力

2.JS定义
JavaScript是一种基于对象和事件驱动的、并具有安全性能的脚本语言。 1.js是一种基于对象的语言(面向对象) 2.js一种弱语言(很重要！)<解释>java语言： a = 123; //编译报错--》java是强语言(格式严格规范) js语言：a = 123; a = "我是中国人"; //没有任何问题--》js是弱语言--（格式很多情况下没有规范）. 3.JS是一种客户端脚本语言，可以在浏览器之上单独运行的语言。

3.JS组成
1.ECMAScript 2.DOM 3.BOM

4.JS基本结构-HelloWorld

5.JS执行原理
6.JS引用方式 6.1内部引入

6.2外部引入（目前来说是最重要的）
解析：现在js文件夹下创建——文件名.js文本写上 documen write（“HellowWord”） 在html页面内引入，代码为

6.3标签内部引入（调试很重要）
解析：如果出现了定义上或者是其他的错误，在浏览器上用F12再进行代码触发后可以及时的去发现问题。

7.JS核心语法 7.1变量
(1)先声明变量再赋值
var width; width = 5; 解析：var a="字符串"; alert("第一次打印"+typeof(a)); <第一次打印的是String类型> var a=123; alert("第二次打印变量a"+typeof(a)); <第二次打印的是anumber类型>

(2)同时声明和赋值变量(企业专用)
var width = 5;

(3)不声明直接赋值（不推荐）
width=5;

7.2数据类型
(1) undefined
变量被声明后，但未被赋值
解析：结果是undefined

(2) null
解析：结果是ture

(3) number
true或false
解析：结果是anumber

(4) boolean
true或false
解析：结果是true或false

(5) string
用单引号或双引号来声明的字符串
解析：结果是String

7.3语法详解
【JS|JS（笔记）】(1)string
alert(s1.length); <显示的是长度> alert(s1.charAt(1)); <返回的是一个字符，脚标从0开始> alert(s1.indexOf("JavaScript")); <从定义的里面检索> alert(s1.substring(3,6)); <从第三个开始取到第六个，第六个取不到，只能取前一个> alert(s1.split(" ")); <间隔>

(2)数组
A.创建数组
第一种方式
var array = new Array(5); array[0] = 2; array[1] = 3; array[2] = "32"; array[7]=23; alert(array.length); 解析：遍历长度的术后会出现8个，超出了范围，前面的定义可以当放屁，JS就是这么的随意。

第二种方式
var array = []; array.push(1); array.push(3); array.push(9);

B.遍历数组
第一种方式（传统for循环）
for(var i = 0; i 第二种方式（增强for循环）
for(var o in array){ document.write(array[o]); }

C.数组常用属性方法
属性：length 方法：join(),push()


7.4企业常用控制语句
if else语句 for语句

7.5注释
alert("恭喜你！注册会员成功"); //在页同上弹出注册会员成功的提示框

7.6输入/输出
alert() 代码案例：alert("你会Java吗？如果会请入职，如果不会请离职!!!"); ? var flag = prompt("提示信息","输入框的默认信息"); alert(flag); 代码案例：var a = prompt("你会Java吗？","会") if(a<给个返回值>){ alert("请入职！！！"); }else{ alert("请面试下一家公司。"); } 代码案例：var str=parseInt（“123”）; alert(isNaN(str)); //解析：是否是非数字运行为false //注意：双重否定表肯定 代码案例： var str=parseInt("123abc"); alert(str); 解析：输出的一定是数字

7.7函数
(1)常用系统函数
parseInt("86")//将字符串“86”转化为了number类型<在JS中只要看到parseInt都会转换成Int类型> parseFloat("34.45") isNaN():用于检查其参数是否是非数字 代码解析：var str1=parseInt("86"); //string类型 var str2=3; var sum=str1+str2; //如果字符串那里不加parseInt进行转换则会报错 alert(sum);

(2)自定义函数
A.有名函数(用的较多)
function haha(){ alert(HellowWord); } haha(); ? ?

B.匿名函数
var a = function(){ alert(234); } a();

8.调试工具

9.拓展
特殊案例：




第二章 1.BOM的定义
BOM：浏览器对象模型（Browser Object Model） BOM提供了独立于内容的、可以与浏览器窗口进行互动的对象结构

2.BOM的组成部分
3.window对象常用方法 3.1 winow.confirm()
显示一个带有提示信息、确定和取消按钮的对话框 var flag = confirm("确认要删除此信息吗？"); if(flag){ alert("删除成功"); }else{ alert("你取消了删除"); } ? var flag=window.confirm("你确认启明是架构吗？"); if(flag){ window.alert("请叫我周架构！！！"); }else{ window.alert("请叫我周开发！！！"); }

3.2 winow.open()
打开一个新的浏览器窗口，加载给定 URL 所指定的文档 333 - 锐客网 ============================================================== ? - 锐客网 demo03.html..... ?

3.3 winow.prompt()
显示可提示用户输入的对话框 代码案例： function a(){ var flag=window.prompt("柳岩，在吗？"); if(flag=="我在"){ alert("我在"); }else{ alert("我去找杨幂！"); } }

3.4 winow.alert()
显示带有一个提示信息和一个确定按钮的警示框 代码案例：function a(){ var flag=window.alert("柳岩，在吗？"); }

4.history对象<对历史记录进行前进和后退的操作>
back() 加载 history 对象列表中的前一个URL,等价于history.go(-1) =>"浏览器后退"
forward() 加载 history 对象列表中的下一个URL,等价于history.go(1)=>"浏览器前进"
go() 加载 history 对象列表中的某个具体URL
案例：
- 锐客网 demo05.html... 返回 返回 ?

5.location对象<跳转>
设置或返回完整的URL ? - 锐客网 触发

6.document对象 6.1 常用属性referrer (返回载入当前文档的URL)
判断页面是否是链接进入 ? - 锐客网 demo07.html...

6.2常用方法
getElementById() 返回对拥有指定id的第一个对象的引用
getElementsByName() 返回带有指定名称的对象的集合
getElementsByTagName() 返回带有指定标签名的对象的集合
案例：
菜鸟教程(runoob.com) - 锐客网 ?单击按钮来改变这一段中的文本。
单击按钮来改变这一段中的文本。
单击按钮来改变这一段中的文本。
?


6.3全选功能(极其重要！)
案例：
- 锐客网 全选:




?

7.JavaScript内置对象 7.1 Date对象
vardate=new Date(); //返回当前日期和时间

getHours() 返回 Date 对象的小时数，其值介于0～23之间
getMinutes() 返回 Date 对象的分钟数，其值介于0～59之间
getSeconds() 返回 Date 对象的秒数，其值介于0～59之间
Insert title here - 锐客网

7.2 Math对象
- 锐客网


    推荐阅读


    上一篇：JQurey|JQuery（笔记）

    下一篇：讲义|数据转换（自动转换+强制转换）