Dom对象学习

最新推荐文章于 2022-12-03 11:02:35 发布

释xin

最新推荐文章于 2022-12-03 11:02:35 发布

阅读量147

点赞数 1

文章标签： js

本文链接：https://blog.csdn.net/Smallwhitestrive/article/details/116667752

版权

1、getElementsByClassName() 方法返回文档中所有指定类名的元素集合，作为 NodeList 对象。

IE8及更早的IE版本不支持 getElementsByClassName() 方法。语法：element.getElementsByClassName(classname)

2、 hasAttribute() 方法用于判断是否有指定的属性存在，如果存在返回 true，否则返回 false IE8及更早的IE版本不支持该方法。

element.hasAttribute(attributename)

3、 hasAttributes() 方法如果某节点有任何属性时返回 true，否则返回 false，IE8及更早的IE版本不支持该方法。

语法：node.hasAttributes()

代码：

<!DOCTYPE html>
<html>

   <head>
       <meta charset="utf-8">
       <title></title>
       <style type="text/css">
           :root{
               margin: 100px 200px;
           }
       </style>
   </head>
   <body>

       <ul class="sashas">
           <li class="myfirst" id="myone">猫咪1号</li>
           <li class="mytwo">猫咪2号</li>
       </ul>

       <p>点击按钮修改第一个列表项的文本信息 </p>
       <button οnclick="myFunction1()">点我修改</button>

       <button οnclick="myFunction2()">点我查看猫咪2号是否有class属性</button><br />
       <p>猫咪2号是否有class属性:<span id="lala1"></span></p>

       <button οnclick="myFunction3()">点我查看猫咪1号是否有任何属性</button><br />
       <p>猫咪1号是否有任何属性:<span id="lala2"></span></p>
       <script>

           function myFunction1() {
               var x = document.getElementsByClassName("sashas")[0];
               x.getElementsByClassName("myfirst")[0].innerHTML = "小狗1号";
           }

           function myFunction2 () {
               var x = document.getElementsByClassName("sashas")[0];
               document.getElementById("lala1").innerHTML = x.getElementsByClassName("mytwo")[0].hasAttribute("class");
           }

           function myFunction3 () {
               document.getElementById("lala2").innerHTML = document.getElementById("myone").hasAttributes();
           }
       </script>
   </body>
</html>

效果：

今天的学习到此结束啦，感兴趣的小伙伴可以复制代码去试试哦

释xin

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Dom对象学习

1、getElementsByClassName() 方法返回文档中所有指定类名的元素集合，作为 NodeList 对象。 IE8及更早的IE版本不支持 getElementsByClassName() 方法。语法：element.getElementsByClassName(classname) 2、 hasAttribute() 方法用于判断是否有指定的属性存在，如果存在返回 true，否则返回 false IE8及更早的IE版本不支持该方法。...
复制链接

扫一扫