如何使用 Javascript 将 href 添加到 div

Question

我想在<div>之后添加<a href='https://google.com'> 。

这是我一直在尝试的：

请问有人可以帮我吗？

谢谢！

Answer 1

这就是你想要的吗？

 <div id="autoComplete_list"> <div data-id="2" class="autoComplete_result"> <span class="autoComplete_highlighted">google</span> </div> </div> <script> var aUrl = document.createElement("a"); aUrl.setAttribute("href", "https://google.com"); aUrl.innerHTML = "<span class='autoComplete_highlighted'>Google</span>" document.querySelector("#autoComplete_list").appendChild(aUrl); </script>

Answer 2

问题

您选择div的方式略有错误。

您使用getElementsByClassName()返回元素列表，而不是单个元素，因此您将获得[div]而不是div 。

解决方案

您可以获取该列表的第一个元素：

document.getElementsByClassName("autoComplete_result")[0]

或使用更简单的Document.querySelector ：

document.querySelector(".autoComplete_result") （仅返回一个元素，而不是数组）。

window.onload=function() {

    // Notice the [0] which selects ONLY the first matched element
    var mydiv = document.getElementsByClassName("autoComplete_result")[0]; 
    var a = document.createElement('a');
    a.setAttribute('href',"https://www.google.com");
    a.innerText = "google link";
    mydiv.appendChild(a);
}

Answer 3

似乎 getElementsByClassName 没有按预期返回，所以 appendChild 不起作用。 我尝试使用 querySelector 并且工作正常。 看看下面的代码片段：

 var mydiv = document.querySelector('.autoComplete_result'); var a = document.createElement('a'); a.setAttribute('href',"https://www.google.com"); a.innerText = "google link"; mydiv.appendChild(a);

 <body> <div id="autoComplete_list"> <div data-id="2" class="autoComplete_result"> <span class="autoComplete_highlighted">goog</span>le </div> </div> </body>

如何使用 Javascript 将 href 添加到 div

问题描述

3 个解决方案

解决方案1
0 2020-05-23 23:46:59

解决方案2
0 2020-05-23 23:54:57

问题

解决方案

解决方案3
0 2020-05-23 23:59:31

如何使用 Javascript 将 href 添加到 div

问题描述

3 个解决方案

解决方案1 0 2020-05-23 23:46:59

解决方案2 0 2020-05-23 23:54:57

问题

解决方案

解决方案3 0 2020-05-23 23:59:31

解决方案1
0 2020-05-23 23:46:59

解决方案2
0 2020-05-23 23:54:57

解决方案3
0 2020-05-23 23:59:31