Ъγ:_小ツ雨oο 发表于 2017-5-15 23:42:41

dom节点问题

<!doctype html>
<html lang="en">
<head>
        <meta charset="UTF-8" />
        <title></title>
        <style type="text/css">

        </style>
        <script type="text/javascript">
                window.onload = function()
                {
                        function styleHeaderSibings(){
                                if(!document.getElementsByTagName)
                                {
                                        return false;
                                }
                                var headers = document.getElementsByTagName("h1");
                                var elem;
                               
                                for(var i = 0; i < headers.length; i++)
                                {
                                        elem = getNextElement(headers.nextSibling);
                                       
                                        elem.style.fontWeight = "bold";
                                        elem.style.fontSize = "40px";
                                        elem.style.color = "red";
                                }
                        }
                }
               
                function getNextElement(node)
                {
                        if(node.nodeType == 1)
                        {
                                return node;
                        }
                       
                        if(node.nextSibling)
                        {
                                return getNextElement(node.nextSilbing);
                        }
                        return null;
                }
        </script>
</head>
<body>
        <h1>a</h1>
        <h1>b</h1>
        <h1>c</h1>
        <h1>d</h1>
</body>
</html>


设置了字体等没反应F12也没错,求救 ==   {:5_99:}

不二如是 发表于 2017-5-15 23:42:42

本帖最后由 不二如是 于 2017-5-17 22:35 编辑

先抛开,DOM树遍历方法正确与否不说。。。

居然要对<h1>这中内置好样式的标签修改大小,就很尴尬了!

建议换成<p>标签,然后放在一个div里

在利用便利一个,id为xxx的div下所有子节点的办法,修改<p>样式



<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title></title>
    <style type="text/css">

    </style>
    <script type="text/javascript">
      var adiv=document.querySelectorAll("#d1 p");
for(i=0;i<adiv.length;i++){
    adiv.style.color="red";
    adiv.style.fontSize="55px";
}
    </script>
</head>
<body>
<div id="try">
<p>a</p>
<p>b</p>
<p>c</p>
<p>d</p>
<p>e</p>
</div>

</body>
</html>

alltolove 发表于 2017-5-16 14:28:39

火狐不支持getElementsByTagName这个语句所以也没法调试{:10_269:}
页: [1]
查看完整版本: dom节点问题