标签：中间 关键字 匹配 src eid 页面 set 移动浏览器 htm
JS是基于对象和事件驱动的脚本语言，作用在客户端（浏览器）上
1、JS的特点
交互性
安全性：（不可以访问本地的硬盘）
跨平台性：浏览器就可以解析js的文件
2、JS组成
（1）ECMAScript 标准（js的语法，变量，函数）
（2）BOM （Browser Object Model） 浏览器对象模型
（3）DOM （Document Object Model） 文档对象模型
3、语法
把JS和HTML的结合一起
方式一：
HTML的文件提供了一个标签 <script type="text/javascript">js的代码</script>，标签可以放在HTML文件的任意位置上。
方式二：引入外部的文件，有一个外部的文件。编写js文件
<script src="引入js文件（相对路径）" >
如果script通过src的属性引入了外部的文件，里面的js代码就不会执行了
var 声明变量
基本数据类型
Undefined、Null、Boolean、Number 和 String
String 字符串类型
双引号和单引号都代表的是字符串
Number 数字类型
不区分整数和小数
Null 空，给引用赋值的
Undefined 未定义（声明变量，没有赋值）
typeof() 判断当前变量是什么类型的数据
运算符
算术运算符
0或者null是false，非0或者非null是true，默认用1表示
比较运算符
== 比较值是否相同
=== 比较值和类型是否相同
数组
声明数组
1 var arr = [12,34,55]; 2 var arr = new Array(5); 3 var arr = new Array(2,3,4)
数组的属性
长度：length
数组的长度是可变的
方法
function 方法名称(参数列表 (num,str)){ return; }
参数列表：不能使用var关键字
返回值：可写可不写的，如果有写返回值，如果没有，返回值可以省略不写
动态函数
1 function getSum(){ 2 return 50; 3 }
js提供了内置对象 Function
匿名函数
没有名称的函数
1 function(){ 2 return 50; 3 }
全局变量：在<script>标签内部定义的变量，全局变量
局部变量：在函数的内部定义的变量，局部变量
对象和API
String 对象
声明
1 var str = "abc"; 2 var str = new String("abc");
属性：
length：字符串的长度
方法:
和HTML相关的方法
1 bold() // 使用粗体显示显示字符串 2 fontcolor(color) // 参数是必须的，设置字体的颜色 3 fontsize(size) //设置字体的大小（1-7） 4 italics() // 斜体 5 link(url) // 设置链接 6 sub() //下标 7 sup() // 上标
和java中String对象类似的
1 charAt(index) // 返回指定位置的字符 2 indexOf(str,fromIndex) // 检索字符串，没有返回-1 3 lastIndexOf(str,fromIndex) // 从后向前检索字符串 4 replace(要替换的字符串,替换成啥) 5 substring(start,stop) // 截取字符串 6 substr(start,length) // 截取字符串，从哪开始，截取多长
Array对象
声明数组
1 var arr = [12,33]; 2 var arr = new Array(4,4);
属性：
length：长度
方法：
1 concat(元素，数组); // 返回新的数组 2 join(s) // 通过s标识（-），进行分隔，返回字符串 3 pop() // 删除末尾的元素，返回最后一个元素 4 push() // 向末尾添加元素，返回新数组的长度 5 sort() // 排序的方法
Date日期对象
var date = new Date(); // 当前的日期
方法：
1 toLocaleString() // 转换本地的日期格式 2 toLocaleDateString() // 只包含日期 3 toLocaleTimeString() // 只包含时间 4 5 getDate() // 返回一个月中的某一天（1-31） 6 getDay() // 返回一周中的某一天(0-6) 7 getMonth() // 返回月份（0-11） 8 getFullYear() // 返回年份 9 10 getTime() // 返回毫秒数 11 setTime() // 通过毫秒数获取日期 12 13 parse(str) // 解析字符串，返回毫秒数
Math对象
1 ceil(x) // 上舍入 2 floor(x) // 下舍入 3 round(x) // 四舍五入 4 random() // 0-1的随机数
RegExp对象
正则表达式对象
应用：编写注册的表单，对表单输入的内容进行校验
1 var reg = new RegExp("表达式"); // （开发中不经常使用） 2 var reg = /表达式/ // 开发中经常使用 3 var reg = /^表达式$/ // 开发中经常使用 4 5 exec(string) // 不经常使用，如果匹配，返回匹配的结果 6 test(string) // 如果匹配，返回是true，如果不匹配，返回是false 7 if(reg.test("abc"))
全局函数
使用全局函数，不需要任何的对象
全局函数可以拿过来使用
global帮着管理全局函数
1 eval() // 可以解析字符串，执行字符串中间的js代码 2 isNaN() // 判断是否是非数字值 3 parseInt() // 解析字符串，返回整数 4 5 encodeURI() // 进行编码 6 decodeURI() // 解析解码 7 8 encodeURIComponent() 9 decodeURIComponent() 10 11 escape() 12 unescape()
BOM 浏览器对象模型（Brower Object Model）
Window 窗口对象
Navigator 和浏览器版本相关的对象
userAgent // 获取浏览器的相关的信息 window.navigator.userAgent // window可以省略不写
Screen 和屏幕相关的对象
History 和浏览器历史相关
1 back() // 返回上一个页面 2 forward() // 去下一个页面 3 go() // 传1等于forward,传-1等于back
Location 和浏览器地址相关的对象
href // 获取和设置浏览器的路径
事件
onclick 点击事件
Document 文档对象
1 alert() // 弹出提示框 2 confirm("参数") // 询问框，提供俩按钮，确定和取消；如果点击是确定，返回true，如果点击取消，返回false 3 moveBy() // 移动浏览器 4 setInterval("函数",毫秒值) // 定时相关的，每隔毫秒值执行一次函数，返回唯一的id值 5 setTimeout("函数",毫秒值) // 到了毫秒值后执行一次函数，返回唯一的id值 6 clearInterval(id的值) // 清除定时 7 clearTimeout() 8 close() // 关闭浏览器的窗口 9 open() // 打开浏览器窗口
属性
opener 返回对创建此窗口的窗口的引用
win open() 弹出baidu的窗口
document对象方法
document.getElementById("nameId"); // 获取到是input标签的对象
DOM 文档对象模型（Document Object Model）
文档：标记型文档（HTML/XML）
对象：封装属性和行为（方法）
模型：共性特征的体现
DOM解析HTML
通过DOM的方法，把HTML全部（元素（标签）、文本、属性）都封装成了对象
<span id="spanId">文本</span>
DOM想要操作标记型文档先解析
DOM解析HTML（浏览器就可以HTML）
DHTML不是一种编程语言
html ：封装数据。 <span>展示给用户的数据</span>
css ：设置样式（显示效果）
dom ：操作HTML（解析HTML）
js ：提供逻辑（判断语句，循环语句）
Document：代表整个文档
方法
1 getElementById("id的值"); // 通过元素的id的属性获取元素（标签）对象。 2 getElementsByName("name属性值"); // 通过名称获取元素对象的集合（返回数组） 3 getElementsByTagName("标签名称"); // 通过标签名称获取元素对象的集合（返回数组） 4 write("文本的内容（html的标签）") // 把文本内容写到浏览器上 5 createElement("元素名称"); // 创建元素对象 6 createTextNode("文本内容") // 创建文本对象 7 appendChild("子节点") // 添加子节点
Element对象
获取元素对象
1 getAttribute("属性名称"); // 获取属性的值 2 setAttribute("属性名称","属性的值"); // 设置或者修改属性的值 3 removeAttribute("属性名称"); // 删除属性
获取元素下的所有子节点
ul.getElementsByTagName();
Node节点对象
nodeName ：节点名称
nodeType ：节点类型
nodeValue ：节点的值
parentNode 获取父节点（永远是一个元素节点）
IE6-8
1 firstChild // 第一个节点 2 lastChild // 最后一个节点 3 nextSibling // 下一同级节点 4 previousSibling // 上一同级节点
IE9-11 Chrome FireFox
1 firstElementChild // 第一个节点 2 lastElementChild // 最后一个节点 3 nextElementSibling // 下一同级节点 4 previousElementSibling // 上一同级节点
1 <ul> 2 <li>北京</li> 3 </ul> 4 // 如果通过ul获取北京的子节点，使用是 ul.firstElementChild; 获取北京的子节点（IE9-11 Chrome FireFox） 5 // 但是如果IE6-8，需要使用firstChild;
1 <span id="spanId"> 2 文本内容 3 </span> 4 // 使用span的标签获取span中间的文本内容（也是对象）,需要使用firstChild;（不管是什么浏览器）
方法
1 hasChildNodes() // 检查是否包含子节点 2 hasAttributes() // 检查是否包含属性 3 appendChild(node) // 父节点调用，在末尾添加子节点 4 insertBefore(new,old) // 父节点调用，在指定节点之前添加子节点 5 replaceChild(new,old) // 父节点调用，替换节点 6 removeChild(node) // 父节点调用,删除节点 7 cloneNode(boolean) // 不是父节点调用,复制节点,boolean如果是true，复制子节点,如果是false，不复制子节点，默认是false
innerHTML ：获取和设置文本内容。
属性
获取文本内容
设置文本内容
事件
onclick 点击事件
onload 加载事件
onfocus 获取焦点事件
onblur 失去焦点事件
全选/全不选/反选的练习
1 <input type="checkbox" /> 2 // 指定默认值：checked 只要出现在<input type="checkbox" />,对号就勾上了。
鼠标移动的事件
onmousemove
onmouseout
onmouseover
鼠标点击事件
onclick 单击
ondblclick 双击
加载和卸载
onload 加载
onunload 卸载
获取焦点和失去焦点
onfocus 获取焦点
onblur 失去焦点
键盘
onkeyup 按下抬起
改变事件
onchange
控制表单的提交
onsubmit
标签：中间 关键字 匹配 src eid 页面 set 移动浏览器 htm
原文地址：http://www.cnblogs.com/1989guojie/p/6943085.html
