0

多个 ID 在我使用 HTML #1 时工作正常,但在我使用 HTML #2 时不起作用。Chrome 网络控制台显示

>> "Uncaught TypeError: Cannot call method 'setAttribute' of null ".

在 html#2 我删除了

<div id="0001"><a href="#"">LOGIN</a></div>,并且浏览器不再工作。

HTML #1

<html>
<head>
<title>Index</title>
</head>
<body>

<div id="0001"><a href="#"">LOGIN</a></div>
<div id="0002"><a href="#"">GO</a></div>
<div id="0003"><a href="#"">VISIT</a></div>
<div id="0004"><a href="#"">EXPLORE</a></div>
<div id="0005"><a href="#"">FUNNY PICS</a></div>
<script>
var element = document.getElementById("0001");
element.setAttribute('onclick', 'window.location.href=\'http://site.com/1.html\'');

var element = document.getElementById("0002");
element.setAttribute('onclick', 'window.location.href=\'http://site.com/2.html\'');

var element = document.getElementById("0003");
element.setAttribute('onclick', 'window.location.href=\'http://site.com/3.html\'');

var element = document.getElementById("0004");
element.setAttribute('onclick', 'window.location.href=\'http://site.com/4.html\'');

var element = document.getElementById("0005");
element.setAttribute('onclick', 'window.location.href=\'http://site.com/5.html\'');
</script>

</body>
</html>

HTML #2

<html>
<head>
<title>Index</title>
</head>
<body>

<div id="0002"><a href="#"">GO</a></div>
<div id="0003"><a href="#"">VISIT</a></div>
<div id="0004"><a href="#"">EXPLORE</a></div>
<div id="0005"><a href="#"">FUNNY PICS</a></div>
<script>
var element = document.getElementById("0001");
element.setAttribute('onclick', 'window.location.href=\'http://site.com/1.html\'');

var element = document.getElementById("0002");
element.setAttribute('onclick', 'window.location.href=\'http://site.com/2.html\'');

var element = document.getElementById("0003");
element.setAttribute('onclick', 'window.location.href=\'http://site.com/3.html\'');

var element = document.getElementById("0004");
element.setAttribute('onclick', 'window.location.href=\'http://site.com/4.html\'');

var element = document.getElementById("0005");
element.setAttribute('onclick', 'window.location.href=\'http://site.com/5.html\'');
</script>

</body>
</html>
4

2 回答 2

3

整个概念很差。如果您有链接,请使用该链接。直接不使用脚本(适用于所有浏览器和 SEO)或更改链接的 href 或 onclick

也没有数字 ID

演示

<html>
<head>
<title>Index</title>
<script type="test/javascript">
 var myLinks = [
'http://bing.com/search?q=go',
'http://bing.com/search?q=visit',
'http://bing.com/search?q=explore',
'http://bing.com/search?q=funny%20pics'
]; // note no comma on the last item
window.onload=function() {
  for (var i=0;i<myLinks.length;i++) {
// EITHER    document.getElementById("d"+i).getElementsByTagName("a")[0]).href=myLinks[i];
// OR   
      document.getElementById("d"+i).getElementsByTagName("a")[0].onclick=(function(idx) {
      var idx = i;
      return function() { // closure 
        location=myLinks[idx];
        return false; // cancel href
      }
    })(i);      
  }
}
</script>
</head>
<body>

<div id="d0"><a href="#"">GO</a></div>
<div id="d1"><a href="#"">VISIT</a></div>
<div id="d2"><a href="#"">EXPLORE</a></div>
<div id="d3"><a href="#"">FUNNY PICS</a></div>

</body>
</html>
于 2013-01-02T06:00:27.177 回答
0

您需要首先检查该元素是否为空。

HTML #2

<html>
<head>
<title>Index</title>
</head>
<body>

<div id="0002"><a href="#"">GO</a></div>
<div id="0003"><a href="#"">VISIT</a></div>
<div id="0004"><a href="#"">EXPLORE</a></div>
<div id="0005"><a href="#"">FUNNY PICS</a></div>
<script>
var element = document.getElementById("0001");
if(element!=null)
{
element.setAttribute('onclick', 'window.location.href=\'http://site.com/1.html\'');
}
var element = document.getElementById("0002");
if(element!=null)
{
element.setAttribute('onclick', 'window.location.href=\'http://site.com/2.html\'');
}
var element = document.getElementById("0003");
if(element!=null)
{
element.setAttribute('onclick', 'window.location.href=\'http://site.com/3.html\'');
}
var element = document.getElementById("0004");
if(element!=null)
{    
element.setAttribute('onclick', 'window.location.href=\'http://site.com/4.html\'');
}
var element = document.getElementById("0005");
if(element!=null)
{    
element.setAttribute('onclick', 'window.location.href=\'http://site.com/5.html\'');
}
</script>

</body>
</html>
于 2013-01-02T06:20:38.097 回答