如何使用 JavaScript 替换 Div 中的所有链接答案

【问题标题】：How to replace all links inside a Div using JavaScript如何使用 JavaScript 替换 Div 中的所有链接
【发布时间】：2017-04-11 07:06:54
【问题描述】：

我想使用 JavaScript 替换特定 DIV 内的所有链接。例如

<div class="div01">
<div class="div02">
    <a href="www.oldlink.com">
        <img src="myimage.jpg" class="imageclass">
    </a>
</div>
<a class="link02" href="www.oldlink2.com">
    <div class="div03">
        <h5>My Heading</h5>
    </div>
</a>

现在我想用我的一个新链接（如 www.mynewlink.com）替换 www.oldlink.com 和 www.oldlink2.com。实际上我正在使用 WordPress，不想使用 PHP 对其进行编辑。我正在使用插件页眉和页脚脚本来执行此操作。 https://wordpress.org/plugins/header-and-footer-scripts/

【问题讨论】：

当您尝试自己执行此操作时，您在哪里卡住了，出了什么问题？它是怎么出错的？你想出了什么 JavaScript？
stackoverflow.com/questions/7892805/…
我试过 var mylink = document.getElementsByClassName('div01'); mylink.setAttribute('href', 'www.mynewlink.com');但不工作。

标签： javascript html wordpress replace href

【解决方案1】：

试试这个：

const div1 = document.querySelector('.tg-one-fourth');

div1.querySelectorAll('a').forEach(a => a.href = '//www.mynewlink.com');

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title></title>
</head>

<body>
  <div class="tg-one-fourth">
    <div class="div02">
      <a href="www.oldlink.com">
        <img src="myimage.jpg" class="imageclass">
      </a>
    </div>
    <a class="link02" href="www.oldlink2.com">
      <div class="div03">
        <h5>My Heading</h5>
      </div>
    </a>
  </div>
</body>

</html>

【讨论】：

我正在尝试通过类 document.getElementsByClassName('div01') 使用此代码，但它不起作用。
确保你喜欢 const div1 = document.getElementsByClassName('div01')[0];
@UsamaEjaz 我不知道为什么它不起作用const div1 = document.getElementsByClassName('tg-one-fourth')[0]; div1.querySelectorAll('a').forEach(a => a.href = '//www.mynewlink.com');
您需要检查div1 变量并确保它是您要定位的div 元素。我猜你使用的是不同的div，因为类可以在可能的地方使用
tg-one-fourth 实际上是我要申请的真正的 div 类。请让您的代码按班级申请。