码迷,mamicode.com
首页 > 其他好文 > 详细

DOM

时间:2018-10-18 22:03:34      阅读:182      评论:0      收藏:0      [点我收藏+]

标签:remove   事件驱动   console   doc   attr   bsp   box   事件   子节点   

DOM的获取:

  1.获取document对象

  console.log(document);

  2.获取html对象

  document.documentElement

  3.获取body对象

  document.body

 

通过三种方法来获取body中的DOM

  div #box.box

  1.通过id获取

  document.getElementById("box")

  2.通过类获取

  document.getElementsByClassName("box")

  3.通过标签获取

  document.getElementsByTagName("div")

 

DOM三步走:

  (1)  获取事件源

  (2)  绑定事件

  (3)  事件驱动

 

DOM操作:

  对标签属性的操作:

    setAttribute()

    getAttribute()

    .src  .alt  .id  .className

  对DOM的创建,销毁的操作:

    创建:  document.createElement,  适用于父DOM插入子DOM

    追加:  父.appendChild(子),父.insertBefore("要插入的节点","参考的子节点")  适用于兄弟之间

    删除:  父.removeChild(子)

  对样式属性的操作:oDiv.style.cssStyle

    对于style对象的操作,css中的属性都可以设置,注意margin属性,使用js设置值的时候是oDiv.style.marginLeft="30px"

  对值的操作:

    (1)  innerText  只是设置文本

    (2)  innerHTML  既设置了文本,又设置了标签

    (3)  value  对于标签中有value属性的设置,表单控件

  

 

    

    

DOM

标签:remove   事件驱动   console   doc   attr   bsp   box   事件   子节点   

原文地址:https://www.cnblogs.com/s593941/p/9812975.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!