脚本仅更改第一个<p>元素</p>

时间:2012-05-13 02:22:28

标签: javascript html getelementsbytagname

以下是我的页面的javascript:

    window.onmouseover = function(){
        var body = document.getElementsByTagName("body")
        var h1 = document.getElementsByTagName("h1");
        var a = document.getElementsByTagName("a");
        var p = document.getElementsByTagName("p")
        for(var j = 0; j < p.length; j++) {
            body[j].style.fontFamily = "helvetica";
            body[j].style.backgroundColor = "rgb(250, 250, 240)"
            p[j].style.fontFamily = "courier";
            a[j].onclick = function() {
                this.style.backgroundColor = "Black"
            }
        }
    }

我有一个h1元素,一个元素和10个p元素。出于某种原因,此代码仅更改第一个p元素的字体,尽管其他一切工作正常吗?为什么这样,我该如何解决?

2 个答案:

答案 0 :(得分:1)

如果您只有一个a元素,并且(当然)只有一个body,则您无法迭代其中的一个window.onmouseover = function(){ var body = document.getElementsByTagName("body") var h1 = document.getElementsByTagName("h1"); var a = document.getElementsByTagName("a"); var p = document.getElementsByTagName("p") body[0].style.fontFamily = "helvetica"; body[0].style.backgroundColor = "rgb(250, 250, 240)" a[0].onclick = function() { this.style.backgroundColor = "Black" } for (var j = 0; j < p.length; j++) { p[j].style.fontFamily = "courier"; } } 。这会导致循环的第二次迭代出错。请改用此代码。

{{1}}

答案 1 :(得分:0)

它可能在循环中第二次生成错误,因为body[1]将无效。移动东西,以便只在p上进行操作。