美文网首页
任务22 DOM、事件

任务22 DOM、事件

作者: 饥人谷_姜琼君 | 来源:发表于2016-12-07 10:03 被阅读0次

    dom对象的innerText和innerHTML有什么区别?
    innerText:获取节点里的所有文本;
    innerHTML:获取节点里的所有信息;

    elem.children和elem.childNodes的区别?
    elem.children:获取元素的所有子节点dom对象,不包含自身的文本内容;
    elem.childNodes:获取元素的所有子节点对象,包含自身的文本内容;
    elem.childNodes:会把子节点和父标签间的空格当作文本内容;

    查询元素有几种常见的方法?
    getElementByID():返回匹配指定ID属性的元素节点;

    getElementsByClassName():返回一个类似数组的对象(HTMLCollection类型的对象),包括了所有class名字符合指定条件的元素(搜索范围包括本身);

    getElementsByTagName():返回所有指定标签的元素(搜索范围包括本身)。返回值是一个HTMLCollection对象;

    getElementsByName():用于选择拥有name属性的HTML元素,返回一个NodeList格式的对象

    querySelector():返回匹配指定的CSS选择器的元素节点。如果有多个节点满足匹配条件,则返回第一个匹配的节点;

    querySelectorAll():返回匹配指定的CSS选择器的所有节点,返回的是NodeList类型的对象;

    如何创建一个元素?如何给元素设置属性?
    创建元素有3种方法:
    createElement方法用来生成HTML元素节点;
    createTextNode方法用来生成文本节点;
    createDocumentFragment方法生成一个DocumentFragment对象;

    给元素设置属性:
    setAttribute用来设置元素节点属性。

    元素的添加、删除?
    元素添加:appendChild()在元素末尾添加元素;
    insertBefore()在某个元素之前插入元素
    replaceChild()替换元素;
    元素的删除:removeChild()

    DOM0 事件和DOM2级在事件监听使用方式上有什么区别?
    在DOM0级事件处理程序,事件名以'on'开头,因此click事件的事件处理程序就是onclick、load事件的事件处理程序就是onload。
    DOM2级事件定义了两个方法,用于处理制定和删除事件处理程序的操作“addEventListener() 和removeEventListener(),接收3个参数:要处理的事件名,作为事件处理程序的函数和一个布尔值;
    使用0级事件处理具有跨浏览器的优势;
    2级事件处理可以添加多个事件处理程序。

    attachEvent与addEventListener的区别?
    一、适应的浏览器版本不同
    attachEvent方法适用于IE addEventListener方法适用于FF
    二、针对的事件不同
    attachEvent中的事件带on 而addEventListener中的事件不带on
    三、参数的个数不同
    attachEvent方法两个参数:第一个参数为事件名称,第二个参数为接收事件处理的函数;
    addEventListener 有三个参数:第一个参数表示事件名称(不含 on,如 "click");第二个参数表示要接收事件处理的函数;第三个参数是一个bool值,一般为false
    第三个参数叫做useCapture,是一个boolean值,就是true or false,如果送出true的话就是瀏览器会使用Capture方式,false的话是Bubbling,只有在特定状况下才会有影响,通常建议是false,而会有影响的情形是目标元素(target element)有祖先元素(ancestor element),而且也有同样的事件对应函数,我想,看图会比较清楚。

    解释IE事件冒泡和DOM2事件传播机制?
    IE事件冒泡:事件发生后先从具体的接收元素,然后逐步向上传播到不具体的元素。
    DOM2事件传播机制:DOM2级事件规定事件流包括三个阶段,事件捕获阶段,处于目标阶段,事件冒泡阶段,首先发生的是事件捕获,为截取事件提供机会,然后是实际目标接收事件,最后是冒泡阶段.

    如何阻止事件冒泡? 如何阻止默认事件?
    阻止事件冒泡:stopProprgation();
    阻止默认事件:preventDefault();

    代码1
    代码2
    代码3
    代码4
    代码5

    相关文章

      网友评论

          本文标题:任务22 DOM、事件

          本文链接:https://www.haomeiwen.com/subject/wmbfmttx.html