美文网首页
Document(5月21日)

Document(5月21日)

作者: 辞苏 | 来源:发表于2018-05-23 19:07 被阅读0次

Dom:

    Document Object Model 文档对象模型 

    专门操作网页内容的API

1.Dom可进行的操作:

    查找 修改 添加 删除

    1)查找

      A.元素间关系查找  案例见demo01

        父子关系:

          parentElement; 查找一个元素的父元素

          children;查找一个元素的所有孩子

          firstElementChild;查找第一个孩子

          lastElementChild;查找最后一个孩子

        兄弟关系:

          previousElementSibling  前一个兄弟元素

          nextElementSibling      下一个兄弟元素

      B.使用HTML元素查找 

        1.按id查找:

          var ele=document.getElementById('id');

              特点:只能找到一个

                    如果没找到返回null

        2.按class查找:

          var ele=document.getElementsByClassName('class');

              可以找到多个,返回一个动态集合

              如果没找到,返回空集合

        3.按标签名查找:

          var ele=document.getElementByTagName('标签名');

              可以找到多个,返回一个动态集合

              如果没找到,返回空集合

        4.按name属性查找

          var ele=document.getElementByName('name');

      C.使用选择器查找

        1.var ele=document.querySelector('选择器');

          特点:只能找到一个,如果找不到,返回null

2.var ele=document.querySelectorAll('选择器');

          特点:查找多个符合选择器要求的函数,如果没找到,返回[]集合

相关文章

网友评论

      本文标题:Document(5月21日)

      本文链接:https://www.haomeiwen.com/subject/dyldjftx.html