DOM操作

dom对象的innerText和innerHTML有什么区别?

innerText指的是元素内文本元素,不包括标签元素。
innerHTML 包括元素内标签和文本元素。

elem.children和elem.childNodes的区别?

dom选取页面元素对象的子对象时
children 选取不包括空白节点
而childNodes在firefox会选取空白节点

查询元素有几种常见的方法?ES5的元素选择方法是什么?

elem.getElementById("id");
elem.getElementsByClassName("ClassName");
elem.getElementsByTagName("TagName");

elem.querySelector(""); //返回第一个选中的元素
elem.querySelectorAll(""); //返回所有选中的元素

如何创建一个元素?如何给元素设置属性?如何删除属性

var oImg = document.createElement("img"); //创建一个元素
oImg.setAttribute("src","xxx"); //给元素设置属性
oImg.removeAttribute("src"); //删除属性

如何给页面元素添加子元素?如何删除页面元素下的子元素?

document.body.appendChild(oImg); //添加子元素
document.body.removeChild(oImg); //删除子元素

element.classList有哪些方法?如何判断一个元素的 class 列表中是包含某个 class?如何添加一个class?如何删除一个class?

element.classList.toggle()  //切换class

element.classList.containes('className')  //true包括,false不包括

element.classList.add('className') //添加一个class

element.classList.remove('className') //删除一个class

如何选中如下代码所有的li元素? 如何选中btn元素?

<div class="mod-tabs">
   <ul>
       <li>list1</li>
       <li>list2</li>
       <li>list3</li>
   </ul>
   <button class="btn">点我</button>
</div>

<script>
  document.querySelectorAll(".mod-tabs li"); //选中所有的li元素
  document.getElementsByClassName("btn"); //选中btn元素
</script>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 基本介绍 文档对象模型 (DOM) 是HTML和XML文档的编程接口。它给文档(结构树)提供了一个结构化的表述并且...
    草鞋弟阅读 3,414评论 0 0
  • dom对象的innerText和innerHTML有什么区别? innerHTML:在读模式下,innerHTML...
    _Dot912阅读 4,017评论 0 1
  • 1: dom对象的innerText和innerHTML有什么区别? innerText:当使用innerText...
    进击的前端_风笑影阅读 3,153评论 0 0
  • dom对象的innerText和innerHTML有什么区别? innerText是一个可写属性,返回元素内包含的...
    蛋黄肉阅读 3,008评论 0 0
  • 1.dom对象的innerText和innerHTML有什么区别? innerText:innerText是一个可...
    饥人谷_有点热阅读 4,302评论 0 0