Question

你可以帮我弄清楚这种情况吗？在我的页面上，我使用的是动态生成随机RGB颜色的Javascript，它被应用于页面上的多个元素。

这是Javascript本身：

function MM_findObj(n, d) { //v4.01
var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+10)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_changeProp(objName,x,theProp,theValue) { //v6.0
var obj = MM_findObj(objName);
if (obj && (theProp.indexOf("style.")==-1 || obj.style)){
if (theValue == true || theValue == false)
eval("obj."+theProp+"="+theValue);
else eval("obj."+theProp+"='"+theValue+"'");
}
}

// get random RGB values so we can change background and link colors
var r = Math.floor(Math.random()*241);
var g = Math.floor(Math.random()*241);
var b = Math.floor(Math.random()*241);

// variables to hold the lighter shade RGB values
var rp1, gp1, bp1, rp2, gp2, bp2, rp3, gp3, bp3;

//we'll use these values to calculate lighter shades
var p1 = .1;
var p2 = .15;
var p3 = .2;

getLighterRGBShades();

// get random intervals used to calculate the changing RGB values
var ri = Math.floor(Math.random()*4);
var gi = Math.floor(Math.random()*4);
var bi = Math.floor(Math.random()*4);

// This changes the color
function randomcolor() {
if (r>239||r<1) ri=ri*-1;
if (g>239||g<1) gi=gi*-1;
if (b>239||b<1) bi=bi*-1;
r+=ri;
g+=gi;
b+=bi;
MM_changeProp('random','','style.color','rgb('+r+', '+g+', '+b+')');

getLighterRGBShades();

setTimeout('randomcolor()',100);
}

function getLighterRGBShades() {
rp1=parseInt((r*p1)+(255-(255*p1)));
gp1=parseInt((g*p1)+(255-(255*p1)));
bp1=parseInt((b*p1)+(255-(255*p1)));
rp2=parseInt((r*p2)+(255-(255*p2)));
gp2=parseInt((g*p2)+(255-(255*p2)));
bp2=parseInt((b*p2)+(255-(255*p2)));
rp3=parseInt((r*p3)+(255-(255*p3)));
gp3=parseInt((g*p3)+(255-(255*p3)));
bp3=parseInt((b*p3)+(255-(255*p3)));
}

一切正常，但问题是我不能在我的页面上多次使用一个函数（在本例中称为 randomcolor（））（在HTML中将objName作为Id应用于不同的元件）。在HTML中，这将如下所示：

<html>
<head>
</head>
<body onLoad="randomcolor()>
...
<a href="#1" id="random">Link#1</a>
...
<a href="#2" id="random">Link#2</a>
...
<a href="#3" id="random">Link#3</a>
...
</body>
</html>

它仅适用于顶部的第一个元素，在本例中为Link＃1，但不适用于以下元素。有什么想法吗？

Answer 1

id是唯一的;你不能有几个id随机的元素。而是使用类。

Answer 2

var arrays = document.body.getElementsByTagName('A');
for(var i = 0; i < arrays.length; i ++) {
    var elem = arrays[i];
    if(elem.id == 'random') {
        elem.style.color = 'rgb('+r+', '+g+', '+b+')';
    }
}

请替换'MM_changeProp（'random'，''，'style.color'，'rgb（'+ r +'，'+ g +'，'+ b +'）'）; '使用上面的那些脚本。

重复的id很糟糕。更好地使用class而不是id。强烈建议导入js选择器库，例如jQuery。然后你只能写一行：

$('.random').css('color', 'rgb('+r+', '+g+', '+b+')');

一个页面上的多个元素的Javascript函数？

2 个答案: