Javascript 无法读取属性'；parentNode'；

我开始学习javascript，我一辈子都不明白为什么控制台中会抛出这个“无法读取属性”parentNode；以及为什么for循环在第三个链接之后调用

我在学习javascript滚动的课程，滚动是有效的，但是为什么会抛出错误呢

<style type="text/css" media="screen">
  #caption, #content {
    width: 30%;
    float: left;
    padding: 10%;
    line-height: 1.675em;
  }
</style>

<script type="text/javascript" charset="utf-8">
  window.onload = initRollover;

  function initRollover() {
    for (var i = 0; i < document.links.length; i++) {  
      console.log(i);  
      if(document.images[i].parentNode.tagName == "A") {
        setupRollover(document.images[i]);
      } 
      document.links[i].setAttribute('class', 'test');
    }
  }

  function setupRollover(thisImage){
    thisImage.outImage = new Image();
    thisImage.outImage.src = thisImage.src;
    thisImage.onmouseout = function() {
      this.src = this.outImage.src;
    }

    thisImage.overImage = new Image();
    thisImage.overImage.src = "images/" + "silver" + ".jpg";
    thisImage.onmouseover = function(){
      this.src = this.overImage.src;
    }
  }
</script>

<div id="content" style="background: lightgreen;">
  <img src="images/silver.jpg" width="240" alt="Silver" id="photoA">
  <br><br>
  <a href="boom.html">
    <img src="images/gold.jpg" width="240" alt="Gold" id="photoB">
  </a>
</div>
<div id="caption">
  <a href="foo.html">Lorem ipsum dolor sit amet,</a> consectetur adipisicing elit, sed do eiusmod
  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
  consequat. <a href="bar.html">Duis aute irure dolor </a>in reprehenderit in voluptate velit esse
  cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
  proident, sunt in <a href="car.html">culpa qui officia deserunt</a> mollit anim id est laborum.
</div>
<div style="clear:both"></div>

#标题#内容{
宽度：30%；
浮动：左；
填充：10%；
线高：1.675em；
}
window.onload=initRollover；
函数initRollover（）{
对于（var i=0；i

敬拜精英，敬拜艾乌斯莫德
暂时性的劳工和财产损失。我们在这里吃得很少，
他在乌拉姆科实验室实习，并在普通实验室实习
康塞奎特。在voluptate velit esse的reprehenderit中
纤毛多洛雷欧盟福吉亚无巴黎。圣奥卡塔铜塔除外
骄傲，必须在莫利特的动物身上。

---

谢谢

我不完全确定你想要达到什么目标。但我看到的问题就在这里

function initRollover() {
for (var i = 0; i < document.links.length; i++) {  
  console.log(i);  
  if(document.images[i].parentNode.tagName == "A") {
    setupRollover(document.images[i]);
  } 
  document.links[i].setAttribute('class', 'test');
}
}

函数initRollover（）{
对于（var i=0；i

在html代码中，有3个带标记的链接，但只有2个带标记的图像。因此，当i=2时，没有document.images[2]。因此parentNode为null。这导致了你的错误

---

希望能有所帮助。

您正在循环

document.links

，但在循环中使用

document.images[i]

。因此，如果你的链接比你的图片多，你会得到错误。我试图运行一个For循环来找出总共有多少个链接（4），然后将所有具有子图片的链接作为目标，或者如果有任何具有父链接的图片，则将其作为目标。我只是想知道为什么If语句会导致错误，因为若并没有链接父对象的图像，那个么它不会被跳过吗？哦，好的。我现在明白目的了。所以问题是当你使用document.links和document.images时，你把它们都算上了。有两种方法可以实现这一点1。你可以用你自己的方式。但是你必须把整个声明放在一个试一试中。。。挡块。如果父链接不存在，请处理错误。2.更简单的方法是查看每个链接的innerHtml并在其中搜索图像。干杯啊，好的。这可能更有意义。谢谢