【笔记】DOM探索基础篇（一）

 

＃DOM探索（前端课程学习笔记）http://www.imooc.com/video/9502

DOM ＝ document ＋ object ＋ model

ECMAScript 编写js应遵守的标准

BOM 通过js可以操作的浏览器对象，例如window

DOM 通过js可以操作的html文档对象

window.onload = function(){ }; //页面所有资源加载完毕后，执行function里面的内容
document.getElementById(‘xx’) //获取文档中ID为xx的对象
a.getElementsByTagName(‘xx’) //获取a对象中的xx标签（如li）的集合
a.offsetWidth //获取a对象的自身宽度
a.style.width = xx; //设置a对象的样式－宽度为xx
a[].length //获取数组a的长度
a.onmouseover = function(){ }; //为a对象绑定onmouseover事件（当鼠标指针移动到a对象上时执行function）
parseInt() //函数可解析一个字符串，并返回一个整数
console.log(‘xx’); //打印执行日志
a.innerText = ‘改变的值’; //获取对象a的文本内容，并设置新的值为‘改变的值’

 

＃立即调用函数表达式

(function(ii){

　　// code....

})(i);

 

——闭包传参，i实际参数与ii形式参数，把i的值传给ii在function中使用［也可不传参］

——详细介绍可参考：

http://www.cnblogs.com/aileLiu/p/3836303.html    

http://www.cnblogs.com/TomXu/archive/2011/12/31/2289423.html

 

＃文档类型的演变

GML（1969年，通用标记语言）—>

SGML（1985年，标准通用标记语言）—> 

HTML（1993年，超文本标记语言－用于显示数据）—> 

XML（1998年，可扩展标记语言－用于存放数据）

---

 

＃文档节点分类

＊ 上图只列出了常用节点类型

＊ 文档节点，是指包含文档类型节点和html元素节点的部分

＊ 基本所有浏览器都支持节点的数值常量（不一定都支持字符常量），例如下图

＊ 行与行之间存在空白节点，例如下图灰色区域

＊ 不同节点的值显示不同，看下图

 

a.nodeType //用于获取元素节点a的节点类型（可用于判断元素节点类型）
a.nodeName //获取对象a的节点名称
a.nodeValue //获取对象a的节点值
a.attributes //获取a对象标签中包涵的所有属性集合
a.childNodes //获取a对象中包涵的所有子节点集合
document.doctype.nodeName //获取文档类型节点的节点名称