zoukankan      html  css  js  c++  java
  • 关于DOM的有关总结

    1.获取DOM元素

      document.getElementById()  通过id获取DOM元素

      document.getElementsByClassName() 通过类名获取DOM元素

      document.getElementsByName();

      document.getElementsByTagName();

      document.documentElement();

      document.body();

      document.querySelector();

      document.querySelectorAll();

    2.DOM节点

      

    3.DOM节点属性 

    • parentNode // document.getElementById("item1").parentNode;
    • childNodes // ele.childNodes; 获得 ele(当前) 元素的子节点集合,它会把空的文本节点当成节点
    • children //ele.children; 只获得元素节点
    • firstChild (firstElementChild) // ele.firstChild 返回首个子节点
    • lastChild (lastElementChild)
    • previousSibling (previousElementSibling) // ele.previousSibling 返回上一个元素节点
    • nextSibling (nextElementSibling) // ele.nextSibling 返回下一个元素节点

    4.DOM操作

    • document.createElement('p');//创建节点
    • box.appendChild(oDiv);//添加节点
    • box.removeChild(oDiv);// 删除节点
    • box.parentNode.insertBefore(oDiv,box); //把新创建的元素添加到指定元素前面
    • oDiv.replaceChild(oP,oDiv);// oP替换oDiv
    • console.log(oDiv.cloneNode(true)); //深度克隆 不传参数默认是false只克隆oDiv这个标签 //如果参数是 true 会把里面的标签也克隆一份
    • box.setAttribute('name','zhufeng'); // 添加属性
    • console.log(box.getAttribute('name')); // 获取属性
    • box.removeAttribute('name') // removeAttribute 移除属性
  • 相关阅读:
    机器学习:特征选择方法简介
    VS快捷键
    非常适用的Sourceinsight插件,提高效率【强力推荐】
    Linux静态库和共享库
    C/C++ 位域知识小结
    __BEGIN_DECLS 和 __END_DECLS
    C语言可变参数va_list
    mac的terminal快捷键
    linux进程、线程与cpu的亲和性(affinity)
    C++ Singleton (单例) 模式最优实现
  • 原文地址:https://www.cnblogs.com/Scar007/p/7505638.html
Copyright © 2011-2022 走看看