无法使用 javascript 设置属性
好吧,这就是我的问题,这可能是我自己的非常明显和愚蠢的错误,我似乎没有注意到,我没有太多地使用 javascript。 我认为这段代码非常明显,我正在显示 3 个 .swf 文件,并且根据生成 3 个随机数的脚本的结果,我想编辑嵌入式 Flash 电影的“src”和“value”属性。
我尝试使用 setAttribute 和 element.value="ecc.." 没有任何作用,属性保持不变
<!DOCTYPE HTML>
<html>
<head>
<title>example</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<script type="text/javascript">
var prereel1=Math.floor(Math.random()*25);
var reel1="flash/"+ prereel1 + ".swf";
var prereel2=Math.floor(Math.random()*25);
var reel2="flash/"+ prereel2 + ".swf";
var prereel3=Math.floor(Math.random()*25);
var reel3="flash/"+ prereel3 + ".swf";
document.getElementById("slot1").value=reel1;
document.getElementById("slot2").setAttribute("value", reel2);
document.getElementById("slot3").setAttribute("value", reel3);
document.getElementById("eslot1").src=reel1;
document.getElementById("eslot2").setAttribute("src", reel2);
document.getElementById("eslot3").setAttribute("src", reel3);
</script>
<div id="slots">
< object width="150" height="210">
<param id="slot1" name="movie" value="flash/1.swf">
<embed id="eslot1" src="flash/1.swf" width="150" height="210">
</embed>
</object><object width="150" height="210">
<param id="slot2" name="movie" value="flash/1.swf">
<embed id="eslot2" src="flash/1.swf" width="150" height="210">
</embed>
</object><object width="150" height="210">
<param id="slot3" name="movie" value="flash/1.swf">
<embed id="eslot3" src="flash/1.swf" width="150" height="210">
</embed>
</object>
</div>
</body>
</html>
well here's my problem, it's probably my own very obvious and stupid mistake which I can't seem to notice, I haven't worked with javascript much.
I think this code is pretty obvious, i'm displaying 3 .swf files, and depending from the result of a script which generates 3 random numbers, i want to edit the "src" and "value" attributes of the embedded flash movies.
i tried both using setAttribute and just element.value="ecc.."
none works, the attribute stays the same
<!DOCTYPE HTML>
<html>
<head>
<title>example</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<script type="text/javascript">
var prereel1=Math.floor(Math.random()*25);
var reel1="flash/"+ prereel1 + ".swf";
var prereel2=Math.floor(Math.random()*25);
var reel2="flash/"+ prereel2 + ".swf";
var prereel3=Math.floor(Math.random()*25);
var reel3="flash/"+ prereel3 + ".swf";
document.getElementById("slot1").value=reel1;
document.getElementById("slot2").setAttribute("value", reel2);
document.getElementById("slot3").setAttribute("value", reel3);
document.getElementById("eslot1").src=reel1;
document.getElementById("eslot2").setAttribute("src", reel2);
document.getElementById("eslot3").setAttribute("src", reel3);
</script>
<div id="slots">
< object width="150" height="210">
<param id="slot1" name="movie" value="flash/1.swf">
<embed id="eslot1" src="flash/1.swf" width="150" height="210">
</embed>
</object><object width="150" height="210">
<param id="slot2" name="movie" value="flash/1.swf">
<embed id="eslot2" src="flash/1.swf" width="150" height="210">
</embed>
</object><object width="150" height="210">
<param id="slot3" name="movie" value="flash/1.swf">
<embed id="eslot3" src="flash/1.swf" width="150" height="210">
</embed>
</object>
</div>
</body>
</html>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
您的脚本放置在 Flash 对象上方。
页面按顺序加载。一旦它到达你的脚本,它就会尝试在 DOM 中查找 id 为“slot1”的对象,但没有找到任何对象,因为它还没有加载它们。
因此,您想要将脚本放在内容下方
或者您可以将代码包装在
onload
块中。这意味着代码仅在页面加载完成时运行。然后您的 Flash 对象将位于 DOM 中,您可以访问它们。
Your script is placed above the flash objects.
The page loads in order. Once it get's to your script it tried to find the object in the DOM with id "slot1" and it does not find any because it has not loaded them yet.
So you want to take your script and place it below the content
Alternatively you can wrap your code in an
onload
block.This means the code only runs when the page has finished loading. Then your flash objects will be in the DOM and you can access them.
就像 Raynos 所说,你的脚本在对象实际存在之前运行。
您可以将代码封装在一个函数中,然后使用 window.onload 来触发该函数,即:
函数 randomizeMovies() {
// 你的东西
}
window.onload = randomizeMovies;
Like Raynos said, your script is running before the objects are actually there.
You can encapsulate your code in a function, and then use a window.onload to trigger that function, ie:
function randomizeMovies() {
// your stuff
}
window.onload = randomizeMovies;
执行完答案一和二后,
document.getElementById('slot1').src="blah";
或者更确定的方法:
document.getElementById('slot1').setAttriibute('src', "blah");
正如您所做的那样,无论哪种方式都有效(不确定),但我相信后者是跨浏览器的(肯定)。
是的,JavaScript 代码似乎只有放在它正在访问的元素后面时才起作用。偶尔我会看到 head 元素中的东西可以工作,但是那里的东西不能一致地工作,而且我还没有找到解决方案来确保浏览器已加载页面。也许 while 循环使用计时器检查页面是否已加载,以免导致浏览器“失控脚本”错误?今天我应该修改这个概念。
(啊 - 丹尼·古德曼的书说,在文档加载期间执行的脚本应该有助于生成文档及其对象。他没有给出任何代码。所以避免加载)
after you have finished executing answers one and two,
document.getElementById('slot1').src="blah";
or a more sure way:
document.getElementById('slot1').setAttriibute('src', "blah");
as you have done, either way works (can't remember for sure), but the latter is cross-browser I believe (definitely).
and yes, the javascript code seems to only work when it is put after the elements it is accessing. once in a while I have seen things work in the head element, but things don't work consistently up there and I have not found a solution yet to ensure that the browser has loaded the page. maybe a while loop checking that the page is loaded using a timer so as not to cause browser "runaway script" errors? I should tinker with that concept today.
(ah - danny goodman's book says that scripts that execute during a document's loading should contribute to generating the document and its objects. and he gives no code for that. so avoid onload)