js的元素对象

Posted 2020-08-15 sunli0205

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js的元素对象相关的知识，希望对你有一定的参考价值。

元素对象（element对象）
** 要操作element对象，首先必须要获取到element，
- 使用document里面相应的方法获取
** 方法
*** 获取属性里面的值
getAttribute("属性名称")
- var input1 = document.getElementById("inputid");
//alert(input1.value);
alert(input1.getAttribute("value"));

*** 设置属性的值
input1.setAttribute("class","haha");

*** 删除属性
input1.removeAttribute("name");

** 不能删除value

*** 想要获取标签下面的子标签
** 使用属性 childNodes，但是这个属性兼容性很差
** 获得标签下面子标签的唯一有效办法，使用getElementsByTagName方法
- var ul11 = document.getElementById("ulid1");

<body>
    <ul id="ulid1">
        <li>aaaaaa</li>
        <li>bbbbbb</li>
        <li>cccccc</li>
    </ul>

    <script type="text/javascript">
        //获取到ul下面的所有子标签（子元素）
        //获取ul标签
        var ul11 = document.getElementById("ulid1");
        //获取ul下面的子标签  属性的兼容性很差一般我们不能用
        var lis = ul11.childNodes;
        alert(lis.length);
        //var lis = ul11.getElementsByTagName("li");
        //alert(lis.length);
    </script>

 </body>

以上是关于js的元素对象的主要内容，如果未能解决你的问题，请参考以下文章

VSCode自定义代码片段9——JS中的面向对象编程

JS常用代码片段2-值得收藏

前端开发常用js代码片段

为什么我不能在此片段中生成唯一对象数组？

jquery 对象的 heightinnerHeightouterHeight 的区别以及DOM 元素的 clientHeightoffsetHeightscrollHeightoffset(代码片段