DOM操作

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

innetText只会选取文本内容,不包括html标签;
innerHTML会选取文本内容以及html标签。

elem.children和elem.childNodes的区别?

elem.childNodes返回所有子节点包括文本空白节点;而elem.children只会返回HTML元素节点。

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

getElementById();          //返回指定ID元素
getElementsByclassName();  //返回指定类名的元素集合(伪数组)
getElementsByTagName();   //返回指定标签名的元素集合(会实时反映元素变化)
getElementsByName();      //返回指定name元素集合(不会实时反映元素变化)
querySelector();            //返回指定CSS选择器元素,如果有多个则返回第一个
querySelectorAll();         //返回指定CSS选择器的所有元素,返回NodeList对象(不会实时反映元素变化)

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

createElement();    //创建元素
getAttribute();      //获取元素属性
createAttribute();   //创建元素属性
setAttribute();        //设置元素属性
removeAttribute();   //删除元素属性
element.attributes     //元素属性类数组对象

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

appendChild();      //在元素末尾添加子元素
insertBefore();     //元素之前插入
removeChild();    //删除子元素
replaceChild();    //替换子元素

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

add( String [, String] )
添加指定的类值。如果这些类已经存在于元素的属性中,那么它们将被忽略。
remove( String [,String] )
删除指定的类值。
item ( Number )
按集合中的索引返回类值。
toggle ( String [, force] )
当只有一个参数时:切换 class value; 即如果类存在,则删除它并返回false,如果不存在,则添加它并返回true。
当存在第二个参数时:如果第二个参数的计算结果为true,则添加指定的类值,如果计算结果为false,则删除它
contains( String )
检查元素的类属性中是否存在指定的类值。

element.classList.contains()    //判断是否存在类值
element.classList.add()         //添加class
element.classList.remove()      //删除指定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.querySelector('.mod-tabs ul li');
document.getElementsByclassName('.btn');
</scrtpt>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 基本介绍 文档对象模型 (DOM) 是HTML和XML文档的编程接口。它给文档(结构树)提供了一个结构化的表述并且...
    草鞋弟阅读 452评论 0 0
  • 题目1: dom对象的innerText和innerHTML有什么区别? innerText是一个可写属性,返回元...
    QQQQQCY阅读 196评论 0 0
  • 1.dom对象的innerText和innerHTML有什么区别? innerText:innerText是一个可...
    饥人谷_有点热阅读 857评论 0 0
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,841评论 18 139
  • 题目1: dom对象的innerText和innerHTML有什么区别? innerText :返回元素内包含的文...
    saintkl阅读 209评论 0 0