关于在Javascript中更新img元素类

时间:2012-03-27 21:20:15

标签: php javascript dynamic elements

我最近遇到了一个名为Google Gravity的网站,我认为在我的主页上实施会很酷。搜索后我发现他们的Javascript可以很容易地使用。我看到了一个从中编码的示例网页,可以在这里看到。 http://ankitpatel.info/mygravity/

我想要做的是在PHP中创建一个内部计数器变量,这样每隔第n次用户进入“Home”页面,比如每隔5次,主页就会获得所有div的重力效果,图像,也许是标题文本。看起来很有趣。

所以我决定在将它编码到我现有的网站之前,我会先用示例页面把它弄好,这样我就可以把它全部准备好并且没有bug。这里是我从上面的网页获得的代码以及我做的一些修改。

在原始代码中,4 img将class ='box2d'硬编码到其中。

在我的主页上,他们最初不会附上该课程。一旦PHP计数器读取第5个视图,我会调用一个Javascript函数Gravity(),它将遍历所有div并将额外的类附加到每个以获得效果..我是正确的,这是最好的方法吗?

我尝试运行以下内容,但它似乎不起作用。但是,如果我手动将class ='box2d'添加到每个它都有效。

我感谢所有对此事的回应。感谢。

<!DOCTYPE html>
<html>
<head>
<title>Bigger Brands - Bigger Gravity (Thanks to Google Gravity js)</title>
<script src="mygravity/ga.js" async="" type="text/javascript"></script>
</head>

<body style="position: static;"onload="getImages()">

<div id="content">
        <img src='mygravity/images/facebook-logo.jpg'/>
    <img src='mygravity/images/google.jpg'/>
    <img src='mygravity/images/twitter.png'/>
    <img src='mygravity/images/microsoft-logo.png'/>
</div>

<script src="mygravity/api" type="text/javascript"></script>
<script src="mygravity/defaulten.js" type="text/javascript"></script>
<script src="mygravity/gravityscript.js" type="text/javascript"></script>

<script language="JavaScript" type="text/javascript"> 
    function getImages(){ 

    var images = document.getElementsByTagName("img");
    var i;

    for(i = 0; i < images.length; i++) {
        images[i].className += " box2d";
        }
    }
</script>

</body>
</html>

1 个答案:

答案 0 :(得分:0)

重力脚本在初始化时查找具有类box2d的所有标签。如果在初始化后添加这些类,则必须在添加类后运行以下类。

init();
run();