dom对象的innerText和innerHTML有什么区别？

innerText是一个可写属性，返回元素内包含的文本内容，在多层次的时候会按照元素由浅到深的顺序拼接其内容
innerHTML属性作用和innerText类似，但是不是返回元素的文本内容，而是返回元素的HTML结构，在写入的时候也会自动构建DOM

elem.children和elem.childNodes的区别？

elem.children只会返回以HTML标签形成的节点。
elem.childNodes会返回包括文本，注释在内的所有节点。使用时容易出现问题，因此多用elem.children。

查询元素有几种常见的方法？

getElementById()方法
返回匹配指定ID属性的元素节点。如果没有发现匹配的节点，则返回null。这也是获取一个元素最快的方法
var elem = document.getElementById("test");
getElementsByClassName()方法
返回一个类似数组的对象（HTMLCollection类型的对象），包括了所有class名字符合指定条件的元素（搜索范围包括本身），元素的变化实时反映在返回结果中。这个方法不仅可以在document对象上调用，也可以在任何元素节点上调用。
var elements = document.getElementsByClassName(names);
getElementsByClassName方法的参数，可以是多个空格分隔的class名字，返回同时具有这些节点的元素。
document.getElementsByClassName('red test');
getElementsByTagName()方法
返回所有指定标签的元素（搜索范围包括本身）。返回值是一个HTMLCollection对象，也就是说，搜索结果是一个动态集合，任何元素的变化都会实时反映在返回的集合中。这个方法不仅可以在document对象上调用，也可以在任何元素节点上调用。
var paras = document.getElementsByTagName("p");
上面代码返回当前文档的所有p元素节点。注意，getElementsByTagName方法会将参数转为小写后，再进行搜索。
getElementsByName()方法
用于选择拥有name属性的HTML元素，比如form、img、frame、embed和object，返回一个NodeList格式的对象，不会实时反映元素的变化。
<form name="x"></form> var forms = document.getElementsByName("x"); forms[0].tagName // "FORM"
注意，在IE浏览器使用这个方法，会将没有name属性、但有同名id属性的元素也返回，所以name和id属性最好设为不一样的值。
querySelector()方法返回匹配指定的CSS选择器的元素节点。如果有多个节点满足匹配条件，则返回第一个匹配的节点。如果没有发现匹配的节点，则返回null。

var el1 = document.querySelector(".myclass"); var el2 = document.querySelector('#myParent > [ng-click]');
querySelectorAll()方法
返回匹配指定的CSS选择器的所有节点，返回的是NodeList类型的对象。NodeList对象不是动态集合，所以元素节点的变化无法实时反映在返回结果中。
elementFromPoint()方法返回位于页面指定位置的元素。

如何创建一个元素？如何给元素设置属性？

createElement()方法用来生成HTML元素节点。
createTextNode()方法用来生成文本节点，参数为所要生成的文本节点的内容。

设置属性

getAttribute()用于获取元素的attribute值
createAttribute()方法生成一个新的属性对象节点，并返回它。
setAttribute()方法用于设置元素属性
romoveAttribute()用于删除元素属性

元素的添加、删除？

appendChild()在元素末尾添加元素
insertBefore()在某个元素之前插入元素
replaceChild()接受两个参数：要插入的元素和要替换的元素
removeChild()删除元素

DOM0 事件和DOM2级在事件监听使用方式上有什么区别？

DOM0把一个方法赋值给一个元素的事件处理程序属性,只能添加单个函数，兼容性好。例如：
<input id="btnClick" type="button" value="Click Here" />

<script type="text/javascript">
    var btnClick = document.getElementById('btnClick');
    btnClick.onclick = function showMessage() {
        alert(this.id);
    };
</script>

DOM2级
DOM2级事件定义了两个方法用于处理指定和删除事件处理程序的操作：
addEventListener
removeEventListener

所有的DOM节点都包含这两个方法，并且它们都接受三个参数：

事件类型
事件处理方法

布尔参数，如果是true表示在捕获阶段调用事件处理程序，如果是false，则是在事件冒泡阶段处理

 <input id="btnClick" type="button" value="Click Here" />

 <script type="text/javascript">
   var btnClick = document.getElementById('btnClick');

   btnClick.addEventListener('click', function() {
       alert(this.id);
   }, false);

   btnClick.addEventListener('click', function() {
       alert('Hello!');
   }, false);
 </script>

通过addEventListener添加的事件处理程序只能通removeEventListener移除，移除时参数与添加的时候相同，这就意味着刚才我们添加的匿名函数无法移除，因为匿名函数虽然方法体一样，但是句柄却不相同，所以当我们有移除事件处理程序的时候可以这样写
var btnClick = document.getElementById('btnClick');

    var handler=function() {
        alert(this.id);
    }

    btnClick.addEventListener('click', handler, false);
    btnClick.removeEventListener('click', handler, false);

DOM2级事件可以指定是否在捕获阶段进行程序处理
可以为事件添加多个处理程序

attachEvent与addEventListener的区别？

IE浏览器适用于attachEvent，而addEventListener适用于主流浏览器
参数的个数不同
第一个参数意义不同，addEventListener第一个参数是事件类型（比如click，load），而attachEvent第一个参数指明的是事件处理函数名称（onclick，onload）
事件处理程序的作用域不相同，addEventListener的作用域是元素本身，this是指的触发元素，而attachEvent事件处理程序会在全局变量内运行，this是window，所以刚才例子才会返回undefined，而不是元素id
为一个事件添加多个事件处理程序时，执行顺序不同，addEventListener添加会按照添加顺序执行，而attachEvent添加多个事件处理程序时顺序无规律(添加的方法少的时候大多是按添加顺序的反顺序执行的，但是添加的多了就无规律了)

解释IE事件冒泡和DOM2事件传播机制？

IE的事件冒泡：事件开始时由最具体的元素接收，然后逐级向上传播到较为不具体的元素

IE的事件冒泡
DOM2级事件规定事件流包括三个阶段，事件捕获阶段，处于目标阶段，事件冒泡阶段，首先发生的是事件捕获，为截取事件提供机会，然后是实际目标接收事件，最后是冒泡阶段

DOM2级事件

如何阻止事件冒泡？如何阻止默认事件？

阻止事件冒泡
DOM2级事件
event.stopPropagation()
IE
event.cancelBubble = true
阻止默认事件
DOM2级事件
event.preventDefault()
IE
event.returnValue = false

Dom、事件

Dom、事件

dom对象的innerText和innerHTML有什么区别？

elem.children和elem.childNodes的区别？

查询元素有几种常见的方法？

如何创建一个元素？如何给元素设置属性？

元素的添加、删除？

DOM0 事件和DOM2级在事件监听使用方式上有什么区别？

attachEvent与addEventListener的区别？

解释IE事件冒泡和DOM2事件传播机制？

如何阻止事件冒泡？如何阻止默认事件？

推荐阅读更多精彩内容

Dom、事件

dom对象的innerText和innerHTML有什么区别？

elem.children和elem.childNodes的区别？

查询元素有几种常见的方法？

如何创建一个元素？如何给元素设置属性？

元素的添加、删除？

DOM0 事件和DOM2级在事件监听使用方式上有什么区别？

attachEvent与addEventListener的区别？

解释IE事件冒泡和DOM2事件传播机制？

如何阻止事件冒泡？ 如何阻止默认事件？

推荐阅读更多精彩内容

如何阻止事件冒泡？如何阻止默认事件？