javascript - 更改嵌套 alt 标签中的 img

Question

如何以编程方式更改下面结构中的以下 img？

  <div id="runner" class="nav brand pull-left">
        <a alt="motherboard" href="/tree/">
            <img alt="mega node" src="img.png"></img>
        </a>
  </div>

firefox 向我指出了这一点

#runner > a:nth-child(1) > img:nth-child(1)

我已经尝试使用如下标准方法和各种命名约定

document.getElementById("#runner").src="icon.png";
document.getElementById("#runner.a.img").src="icon.png";
document.getElementById("#runner.img").src="icon.png";
document.getElementById("mega node").src="icon.png";

我什至试过 css 都无济于事，

div#runner {
    content:url("img.png");
}

Answer 1

您正在 getElementById() 中指定参数以错误的方式，您应该只提供一个 id , 没有选择器 # .您可以找到您的 #runner div然后找到第一个 <img>在其中标记并更改它的src属性:

  document.getElementById('runner').querySelector('img').src = 'icon.png' 

Example

或者更简单，不使用 getElementById() :

 document.querySelector('#runner a img').src = 'icon.png'

Example