DOM操作-遍历一个元素的所有属性

代码:

 

<!DOCTYPE html>
<html>
    <head>
        <title>遍历打印一个元素的所有属性</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <script type="text/javascript">
            //获取DOM的所有属性
            function getDomValues(){
                //获取链接的DOM
                var myLink = document.getElementById("myLink");
                var str = '';                //结果拼接
                for(var prop in myLink){    //循环遍历myLink的所有属性key
                    //拼接到str,key和value用冒号隔开
                    str += prop + " : " + myLink[prop] + "<br/>";
                }
                //打印到网页里
                document.getElementById("valuesP").innerHTML = str;
            }
        </script>
    </head>
    <body style="text-align:center">
        <p>
            <!-- 定义链接和按钮 -->
            <a id="myLink" href="#">链接</a>
            <br/>
            <input type="button" value="获取链接DOM的属性" onclick="getDomValues();"/>
        </p>
        <!-- 用于放置结果的p标签 -->
        <p id="valuesP" style="text-align:left;"></p>
    </body>
</html>

 

posted @ 2016-09-20 20:56  承载梦想-韩旭明  阅读(3097)  评论(0编辑  收藏  举报