[英]Why JS Error IN IE6 (not var variables)
I coded the following JS 我编码了以下JS
<html>
<body>
<img id="img" src="http://example.com/img.jpg" />
<script type="text/javascript">
//<![CDATA[
(function(){
img = document.getElementById("img");
img.src = "http://example.com/img.png";
})();
//]]>
</script>
</body>
but on IE6 some js errors are occured. 但在IE6上却发生了一些js错误。
Because Should I use var img? 因为我应该使用var img吗? incidentally
偶然
<body>
<img id="img" src="http://example.com/img.jpg" />
<script type="text/javascript">
//<![CDATA[
(function(){
var img = document.getElementById("img");
img.src = "http://example.com/img.png";
})();
//]]>
</script>
</body>
</html>
is no problem I can't get the reason why Could you explain me? 没问题,我不明白你为什么能解释我?
If you omit var
when you're declaring a variable, and that variable doesn't exist in current local scope, one of two things will happen: 如果在声明变量时省略
var
,并且该变量在当前本地范围中不存在,则会发生以下两种情况之一:
So, don't use global variables and use var
whenever possible. 因此,请勿使用全局变量,并尽可能使用
var
。 As Tomas already pointed out, your script could be run before the structure is loaded by the browser. 正如Tomas已经指出的那样,您的脚本可以在浏览器加载结构之前运行。
The script is running before the whole body structure is loaded by the browser. 该脚本在浏览器加载整个主体结构之前运行。 So, your function can't find the
img
element. 因此,您的函数找不到
img
元素。 Invoking your function at the onLoad
body event would fix the error. 在
onLoad
主体事件上调用您的函数将解决此错误。
Ie: 即:
<html>
<head>
<script type="text/javascript">
//<![CDATA[
function loadImage(){
img = document.getElementById("img");
img.src = "http://example.com/img.png";
}
//]]>
</script>
</head>
<body onLoad="loadImage();">
<img id="img" src="http://example.com/img.jpg" />
</body>
</html>
The only problem is that you're not using var
to declare the img
variable. 唯一的问题是您没有使用
var
声明img
变量。 There is no problem with the fact that the rest of the body may not have been parsed, so don't worry about that. 身体的其余部分可能没有被解析这一事实没有问题,因此不必担心。
The reason that the absence of var
is causing a problem here is that img
is colliding with property of the global object created for you by the browser. 缺少
var
会在这里引起问题的原因是img
正在与浏览器为您创建的全局对象的属性发生冲突。 In IE, each element with an ID creates a property of the global object (which is therefore accessible everywhere) corresponding to that ID. 在IE中,每个具有ID的元素都会创建与该ID相对应的全局对象的属性(因此可以在任何地方访问)。 This property is read-only, so if you try and assign to it, you get an error.
此属性是只读的,因此,如果尝试为其分配,则会收到错误消息。 If you declare it first, you create a new variable which doesn't interfere with IE's global property and it will work as you expect.
如果先声明它,则将创建一个不会干扰IE全局属性的新变量,它将按预期工作。
You would also find that changing the variable name not to collide with an ID or property of window
would fix the problem: 您还会发现,更改变量名称以使其与
window
的ID或属性不冲突将解决此问题:
banana = document.getElementById("img");
banana.src = "http://example.com/img.png";
... but this is not a good idea either since you're automatically polluting the global scope with your banana
, which could have consequences in other code, and in ECMAScript 5 strict mode you would get an error. ...但这不是一个好主意,因为您会自动用
banana
污染全局范围,这可能会对其他代码产生影响,而在ECMAScript 5严格模式下,您会得到一个错误。
Finally, unless you're using XHTML (which you almost certainly shouldn't be and your example doesn't have an XHTML doctype), there's no need for the CDATA mark-up. 最后,除非您使用XHTML(几乎可以肯定不应该使用XHTML,并且您的示例没有XHTML文档类型),否则不需要CDATA标记。 You should remove it.
您应该将其删除。
Moral of the story: always declare your variables . 故事的寓意: 始终声明您的变量 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.