如何使用javascript更改href值？

Posted 2023-03-05

【中文标题】如何使用javascript更改href值？

【英文标题】：How to change href value using javascript?

【发布时间】：2021-05-01 07:10:57

【问题描述】：

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

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

我已经尝试并在所有帖子内容之后注入了这段代码sn-ps：

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

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

<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">下的标签，是我的错误。

【问题讨论】：

你能展示你的锚标签吗？

您展示的<a> 元素没有id "menu-item-7062"，也没有任何id...

Ты по моему забыл добавить id своему 锚标签:)

【参考方案1】：

这将帮助您检查和设置标签“a”没有“id”的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';

【参考方案2】：

你应该试试这个..

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

如果你不知道 a 的索引，那么你应该得到 id 的 a 然后设置链接。

【参考方案3】：

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

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

</script>

【参考方案4】：

你试过setAttribute函数吗

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