列表中创建链接

我有一个列表看起来像这样列表中创建链接

<li class="list">text1</li> 
<li class="list">text2</li> 
<li class="list">text3</li>

，并希望使文本链接，使用JavaScript的

<li class="list><a href="#text1">text1</a></li> 
<li class="list><a href="#text1">text1</a></li> 
<li class="list><a href="#text1">text1</a></li>

我已经这样做，但不要这样的结果不知道下一步该怎么做？

var link1 = document.createElement("a"); 
link.href = "#text1"

是否有可能使一个循环或类似的东西，这样我就不用写了所有三个环节相同的代码？

来源

2016-04-03 dory

你能澄清你的问题？如果您已经使用链接编辑了HTML，那么为什么您需要对JavaScript做任何事情？你是否在动态改变链接？你是否试图首先动态创建它们？任何澄清将有所帮助！ – JasCav

是的，首先你需要通过他们找到所有的列表类标签和循环。

var lists = document.getElementsByClassName("list"); 
for(var i=0; i<lists.length; i++) {

下一页查找当前列表元素的文本，将其存储在一个变量，然后清除元素的文本。

var text = lists[i].textContent; 
lists[i].textContent = "";

三，创建a元素，使一个元素的textContent当前列表中的href的文字，当前文本加上#迹象。

var a = document.createElement("a"); 
a.href = "#"+text; 
a.textContent = text;

最后将a附加到当前列表元素中。

lists[i].appendChild(a);

var lists = document.getElementsByClassName("list"); 
 
for(var i=0; i<lists.length; i++) { 
 
    var text = lists[i].textContent; 
 
    lists[i].textContent = ""; 
 
    var a = document.createElement("a"); 
 
    a.href = "#"+text; 
 
    a.textContent = text; 
 
    lists[i].appendChild(a); 
 
}

<li class="list">text1</li> 
 
<li class="list">text2</li> 
 
<li class="list">text3</li>

来源

2016-04-03 22:42:45 Wowsk

遍历列表元素添加锚点HTML的文本替换：

[].forEach.call(document.querySelectorAll('.list'), function (el) { 
    var txt = el.textContent; 
    el.innerHTML = '<a href="#' + txt + '">' + txt + '</a>'; 
});

DEMO

来源

2016-04-03 22:42:22 Andy

列表中创建链接

回答

相关问题