如何使用 javascript 更改 href 值？

Question

我有一个 wordpress 站点和主题，它使我能够更改仅显示的所有页面上的菜单小部件中的元素。

所以，我想做的是在一页上本地更改菜单元素的链接和名称。 我有一个用于菜单 li 元素的 id，例如“menu-item-7062”和一个带有已定义链接和文本值的 href 标记。

在所有帖子内容之后，我已经尝试并注入了这个代码片段：

<script type='text/javascript'> document.getElementById('menu-item-7062').href = 'new link'; </script>

我还创建了一个在 onclick 事件之后触发的 function：

<script type="text/javascript">
  document.getElementById("menu-item-7062").onclick = function() {
    document.getElementById("menu-item-7062").href="my new link"; 
  };
</script>

不幸的是，它们并没有影响我的旧链接。 回到我的问题，我可以尝试哪些其他解决方案来更改 href 链接和文本值？ 我犯了哪些可能的错误？

更新：

这是我的锚标签

<a href="https://test.etm.io/ru/services/automation/">Автоматизация технологических процессов</a>

位于<li id="menu-item-7062">下的标签，这是我的错误。

Answer 1

你试过 setAttribute function

document.getElementById("menu-item-7062").setAttribute("href", "my new link");

Answer 2

我已经成功地通过查询选择器影响了一个标签：

 <script type="text/javascript">
    var tag = document.querySelector('a[href="https://test.etm.io/ru/services/automation/"]');
if(tag){
   tag.innerHTML = "new";
}
</script>

Answer 3

你应该试试这个..

 var a = document.getElementsByTagName("a"); a[0].href = "www.abc.com/";

如果您不知道 a 的索引，那么您应该获取a id然后设置链接。

Answer 4

这将帮助您检查和设置没有“id”的标签“a”的href：

const parent = document.getElementById("menu-item-7062");

if(parent.firstElementChild.localName === 'a') {
    const child = parent.firstElementChild;
    child.href = 'my new link';
}

或者

const parent = document.getElementById("menu-item-7062");
parent.firstElementChild?.href = 'my new link';