标签：总结 事件处理 自定义 dom 元素 js 事件 ... 属性

ES + DOM + BOM
1 DOM 文档对象模型 Document object model
dom树

               html
                |
        head        body
         |           |
       meta title   div 
2 事件-----行为
  三要素 事件类型(具体什么行为)、事件源（谁身上发生该行为）、事件处理

  js程序如何处理事件
     事件源.事件 = 事件处理函数 

DOM
元素操作
创建元素
    1 document.write() （一般不用）
    2 innerHTML
    3 document.createElement
增加元素
    appendChild()
    append() (有兼容问题)
    insertBefore()
删除元素
    removeChild()(知道父元素)/remove()(自杀)
修改元素
    修改属性 
         .src/.href/.title/...(标准属性)
         setAttribute()/getAttribute()/removeAttribute()(标准属性和自定义属性都可以操作)
         也可以用data-*的方式在html标签上自定义属性，或者使用JavaScript 的dataset 设置自定义属性，读取的时候也是通过dataset对象，使用”.”来获取属性
    修改元素内容
        innerHTML(支持标签)/innerText(不支持标签)
    修改表单元素
        value/type/disabled/checked/...
    修改元素样式 
        style.***
        className 
查找元素  
  1 api 

  2 h5新增api

  3 关系属性
    parentNode
    children
    previousElementSibling (文本元素)
    nextElementSibling (文本元素)
事件操作
      事件源.事件 = 事件处理函数 
      onclick
      onm ouseover/onmouseout
      onfocus/onblur
      onm ousedown 
      ...             

标签：总结,事件处理,自定义,dom,元素,js,事件,...,属性
来源： https://www.cnblogs.com/lyt0207/p/11919226.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。