JavaScript DOM,获取节点元素

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <p id="in" class="out">我是一个段落
            <a href="" name="na">我是一个链接</a>
        </p>
        <script type="text/javascript">
            /*DOM (文档对象模型)
             * 可访问 JavaScript HTML 文档的所有元素,控制web页面
             * 通过可编程的对象模型,JavaScript 获得了足够的能力来创建动态的 HTML。
                能够改变页面中的所有 HTML 元素
                 能够改变页面中的所有 HTML 属性
                能够改变页面中的所有 CSS 样式
                能够对页面中的所有事件做出反应
             */
            
            //1.获取元素节点
                //1.通过id查找html元素  id是一个没有s
                var x=document.getElementById("in");
                //2.通过类名查找html元素
                var x=document.getElementsByClassName("out");
                //3.通过标签查找html元素
                var x=document.getElementsByTagName("p");
                //4.通过name查找html元素
                var x=document.getElementsByName("na");
                //5.查找子标签,如查找 查找 id="in" 元素下的所有 <a> 元素:
                var x=document.getElementById("in");
                var y=x.getElementsByTagName("a");
                
            //2.读取元素内部的html代码
                //document.getElementById("in").innerHTML="段落被修改了";
            //3.读取属性
            document.getElementsByTagName("a").name;
        </script>
    </body>
</html>

 

posted @ 2019-07-28 17:09  WideWang  阅读(131)  评论(0编辑  收藏  举报