dom

一，DOM简介 JavaScript操作网页的接口，全称为“文档对象模型”(Document Object Model)。 整个文档是一个文档节点，每个标签是一个元素节点，包含在元素中的文本是文本节点，每一个属性是一个属性节点，注释属于注释节点。 二，DOM元素节点 nodeName（节点名称） 元素的标签名，返回字符串，以大写的形式表示，只读 nodeValue（节点值）text节点或Comment节点的文本内容，可读写 nodeType（节点类型）该节点类型，只读 （返回以上节点类型后面对应的值） attributes （属性集合） Element节点的属性集合 ,属性值可以改，但属性名不可以改 一些重要的节点类型 元素 element_node 节点类型 1 属性 attribute_node 节点类型 2 文本text_node 节点类型 3 注释 comment-node 节点类型 8 文档 dpcument_node 节点类型 9 三，DOM的父级元素以及兄弟元素 基于节点 parentNodes 父节点 childNodes 子节点 firstChild 第一个字节点 lastChild 最后一个字节点 lastChild 后一个兄弟节点 previousSibling 前一个兄弟节点 基于元素 parentElement 返回当前元素的父元素节点（且IE不兼容）

这里是修真院前端小课堂，每篇分享文从 【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】 八个方面深度解析前端知识/技能。 大家好，我是IT修真院上海分院Web刘洪利。 今天给大家分享的是：关于JavaScript中常见的DOM操作 1.背景介绍 什么是DOM？简单地说，DOM是一套对文档的内容进行抽象和概念化的方法 在现实世界里，人们对所谓的'世界对象模型'都不会陌生，例如，当用'汽车'、'房子'和'树'等名词来称呼日常生活环境里的事物时，我们都可以百分百的肯定对方知道我们说的是什么，这是因为人们在对这些名词所代表的的东西有着相同的认知。于是，当对别人说"汽车停在车库里"时，可以断定他们不会理解为"小鸟关在壁橱里" 我们的"世界对象模型"不进可以用来描述客观存在的事物，还可以同来描述抽象概念。例如，假设有个人想我问路，而我给出的答案是"左边第三栋房子"，这个答案有没有意义取决于那个人能够理解"左边"和"第三"的含义。如果他不会数数或者分不清左右，则不管他是否理解这几个概念，我的回答对他都不会有任何的帮助。在现实世界中，正是因为大家对抽象的"世界对象模型"有着基本的共识，人们才能用非常简单的话来表达出复杂的含义并得到对方的理解。 而DOM的定义则是由W3C所制定的标准，定义为"一个与系统平台和编程语言无关的接口

鼠标事件类型 click：当用户点击某个对象时调用的事件句柄。 dbclick：当用户双击某个对象时调用的事件句柄。 mousedown：鼠标按钮被按下。 mouseup：鼠标按键被松开 mouseover：鼠标移到某元素之上 //进入它的子元素也会触发 mouseout：鼠标从某元素移开 //进入它的子元素也会触发 mouseenter：鼠标移到某元素之上 //不包括它的子元素 mouseleave：鼠标从某元素移开 //不包括它的子元素 mousemove：鼠标在某元素移动。 HTML事件 //在html绑定，在类型前加"on"HTML部分：<button onclick=”qq(this)”> 开始 </button> //this可以把自身发送到qq函数去 JavaScript部分： function qq (abc){ } //接收到的abc就是整个button本身 注：函数用this指向button本身，这样函数体就不用用id等方式获取dom元素了，有发送就得接收，函数function qq (abc)，可以用abc等接收 script要放在head里面时，用 window.onload=function(){} //页面加载完之后再加载该脚本 获取select下拉框的值，两种方法 　//var a = this.value; 　//var a = menu

构造jquery对象 jQuery对象是一个 类 数组对象。 一）构造函数jQuery() 构造函数的7种用法: 1.jQuery(selector [, context ]) 传入字符串参数：检查该字符串是选择器表达式还是HTML代码。如果是选择器表达式，则遍历文档查找匹配的DOM元素， 并创建一个包含这些DOM元素引用的jQuery对象。如果没有匹配的DOM，则创建一个length属性为0的空jQuery对象。 默认情况下对匹配元素的查找从根元素document开始，但也可以传入context参数限制查找范围。 如果选择器表达式是简单的'#id'且没有context参数，则调用document.getElementById()查找。 如果不是则调用jQuery的find()方法。 2.jQuery(html [, ownerDocument])、jQuery(html, props) 如果传入的参数是html代码，则尝试用html代码创建新的DOM元素，并创建包含这些DOM元素引用的jQuery对象。 如果html代码是单独的标签，使用document.createElement()创建DOM元素。如果是复杂的html代码，则使用innerHTML. 参数ownerDocument用于创建新DOM元素的文档对象，如果不传入默认为当前文档对象。 如果html代码是单独标签