Question

我目前在JavaScript中遇到错误。代码如下：

function loader() {
    size = window.innerWidth;
    size = size - 300;
    mainj = document.getElementById('main1');
    mainj.style.left = size.toString() + 'px';
    submainj = document.getElementById('submain1');
    submainj.style.left = size.toString() + 'px';
    size = mainj.style.top + 26;
    document.getElementById('submain1').style.top = size.toString() + 'px';
}
onload = loader();

错误仅在Internet Explorer中出现，并且代码在Firefox中完美运行。错误显示在第五行，错误是

Message: Object required
Line: 34
Char: 1
Code: 0
URI: http://localhost/home.php

第34行是代码中给出的第5行 - 'mainj.style.left .....' 我该如何解决这个问题？

Answer 1

确保您拥有ID = main1

的DOM元素

如果不存在，那么您的代码将返回错误。

你能做的是有条件的：

if(mainj  !== undefined) {  //if mainj is a real object
   //do code with mainj
}

还尝试在代码中使用局部变量（在带有var的变量之前），这样它们就不会进入全局范围。

Answer 2

这是违规行：

size=window.innerWidth-300;

据我所知，Internet Explorer在窗口上没有内部宽度的概念。以下代码是一个不错的跨浏览器实现，类似于您在库中看到的内容。如果你也需要高度，还有相应的innerHeight和offsetHeight属性。

var size = 0;
if(window.innerWidth) {
    size = window.innerWidth;
} else if (document.documentElement && document.documentElement.offsetWidth) {
    size = document.documentElement.offsetWidth;
} else if (document.body && document.body.offsetWidth) {
    size = document.body.offsetWidth;
}

JavaScript：Internet Explorer中的document.getElementById（）出错

2 个答案: