如何使用Javascript將定位標記插入到列表項中？

Question

我有在HTML5

<li class="navi"> HOME </li> 

該列表項我想通過插入JavaScript中的類名稱的錨標記一個類名一個列表項。主播是在這裏：

<a href="#hOME">HTML</a> 

我怎麼能做到這一點是：

**<li class="navi"><a href="#HOME" >HOM E</a> </li>** 

Answer 1

純香草的javascript：

function makelink() { 
 
    var li = document.getElementsByClassName('navi')[0]; 
 
    li.innerHTML = '<a href="#hOME">HTML</a>'; 
 
}

<ul> 
 
<li class="navi"> HOME </li> 
 
</ul> 
 

 
<button onclick="makelink()">click here to make HOME link</button>

Answer 2

如果你使用jQuery，你可以這樣做：

$li = $('li.navi'); 
$li.html("<a href='#"+ $li.text() +"'>"+ $li.text() +"</a>"); 

Answer 3

試試這個

$(document).ready(function(){ 
 
\t $("ul").append("<li class='navi'><a href='#HOME' >HOM E</a></li>") 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script> 
 
<ul> 
 
<li class="navi"> HOME </li> 
 

 
</ul>

Answer 4

沒有完整的代碼示例顯示您正在嘗試什麼，大家都在猜測。但你可以嘗試：

$('.navi').append('<a href="#HOME">HOME</a>'); 

Answer 5

Document.createElement和Node.appendChild

var listItem = document.querySelector('navi'); 
var name = listItem.innerText; 
var anchor = document.createElement('a'); 
var anchor.href = "#"+name; 
var anchor.innerText = name; 
listItem.appendChild(newNode);