欢迎访问 如意编程网！
TAG聚合

如意编程网

当前位置： 首页 > 前端技术 > HTML >内容正文

HTML

获取标签(元素)节点">HTML DOM-->获取标签(元素)节点

发布时间：2022/11/16 HTML 10 老码农
如意编程网 收集整理的这篇文章主要介绍了 获取标签(元素)节点">HTML DOM-->获取标签(元素)节点 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

1.根据元素id获取元素节点：

　　document.getElementById(str)

　　举例：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>js_excise</title>
        <script src="./js/js_excise.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body style="height: 187.5rem;">
        <div id="box">这个一个div</div>
        <script type="text/javascript">
            var jsDiv = document.getElementById('box')
            console.log(jsDiv)
            console.log(typeof(jsDiv))
        </script>
    </body>
</html>

　　输出：

HTML DOM-->获取标签(元素)节点

 

2.获取相同class属性的元素节点列表

　　document.getElementsByClassName()

　　注意：此方法不支持IE8以下

　　举例：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>js_excise</title>
        <script src="./js/js_excise.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body style="height: 187.5rem;">
        <div>screen</div>
        <div>verse</div>
        <div>take</div>
        <script type="text/javascript">
            var js = document.getElementsByClassName('box2')
            console.log(js)
            console.log(typeof(js))
        </script>
    </body>
</html>

　　输出：

HTML DOM-->获取标签(元素)节点

 

3.根据标签名来获取元素节点的集合

　　getElementsByTagName()

　　举例：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>js_excise</title>
        <script src="./js/js_excise.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body style="height: 187.5rem;">
        <div>screen</div>
        <div>verse</div>
        <div>take</div>
        <script type="text/javascript">
            var js = document.getElementsByTagName('div')
            console.log(js)
            console.log(typeof(js))
        </script>
    </body>
</html>

　　输出：

HTML DOM-->获取标签(元素)节点

 

4.根据name属性值来获取元素节点的集合

　　document.getElementsByName('name_value')

　　举例：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>js_excise</title>
        <script src="./js/js_excise.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body style="height: 187.5rem;">
        <input type="text" name="Text">
        <input type="text" name="Text">
        <input type="text" name="Text">
        <script type="text/javascript">
            var js = document.getElementsByName('Text')
            console.log(js)
            console.log(typeof(js))
        </script>
    </body>
</html>

　　输出：

HTML DOM-->获取标签(元素)节点

总结

以上是如意编程网为你收集整理的获取标签(元素)节点">HTML DOM-->获取标签(元素)节点的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得如意编程网网站内容还不错，欢迎将如意编程网推荐给好友。