关于DOM操作的一些面试知识点

2019-03-20  本文已影响0人  旧时袋

1. DOM的本质

DOM 可以理解为浏览器拿到HTML代码,结构化一个浏览器能够识别js可操作的一个模型而已

2.DOM节点操作

  1. 获取节点
    /*根据id获取标签*/
    var div1 = document.getElementById('div1')            //元素
    /*根据标签名称获取标签*/
    var divList = document.getElementsByTagName('div2')   //集合   
    /*根据类名来获取标签*/
    var div3 = document.getElementsByClassName('div3')    //集合
    /*返回文档中匹配指定 CSS 选择器的所有元素
    返回 (NodeList)对象*/
    var div4 = document.querySelectorAll('p')             //集合

特别要说明一点的是,上面代码中的集合都能够通过下方代码得到其集合的 长度每个元素(与数组获取元素类似)

  console.log(divList.length)    //长度
  console.log(divList[0])        //第一个元素

2.property (js对象属性)

  var pList = document.querySelectorAll('p')
  var p = pList[0]
  console.log(p.style.width)    //获取样式
  p.style.width = '100px'       //修改样式
  console.log(p.className)      // 获取class
  p.className = 'abc'           //修改class

  //获取 nodeName 和 nodeType
  console.log(p.nodeName)
  console.log(p.nodeType)

.........未完待续(2019.03.20 _ 23:35)

3.DOM结构操作

4.BOM操作

上一篇 下一篇

猜你喜欢

热点阅读