如何用replaceChild替换ul
[英]How replace li on ul with replaceChild
问题描述
I have the following code on a webpage: 
我在网页上有以下代码：
<ul id="liste">
<li>Paris</li>
<li>Marseille</li>
<li>Lyon</li>
<li>Strasbourg</li>
<li>Bordeaux</li>
<li>Toulouse</li>
</ul>
and I want to replace the third item of <li> by a name I will type in this 我想用一个名称替换<li>的第三项
<input type="button" value="onclick="remplacer_ville()"/><input id="remplacement" type="text"/><br /><br />
I try this function but it doesn't work. 我尝试了此功能，但是它不起作用。 Help! 救命！
function remplacer_ville(){
var ul = document.getElementById('liste');
var li = ul.getElementsByTagName('li');
var troisieme_ville = li[2];
var nouvelle_ville = document.getElementById('remplacement').value;
troisieme_ville.replaceChild(nouvelle_ville,troisieme_ville);
}
i'm sorry my english is bad i'm french 对不起，我的英语不好，我是法语
3 个解决方案
解决方案1
0 已采纳 2014-02-02 15:34:43
If what you're trying to do is to get the value that was typed by the user and put it into the 2nd <li> tag, then you need to go about it differently: 如果您要获取的是用户键入的值并将其放入第二个<li>标记中，那么您需要进行不同的处理：
var ul = document.getElementById('liste');
var li = ul.getElementsByTagName('li');
var troisieme_ville = li[2];
var nouvelle_ville = document.getElementById('remplacement').value;
// now put this value into the li tag by setting the .innerHTML
troisieme_ville.innerHTML = nouvelle_ville;
.replaceChild() tries to take one DOM element and replace it with another and takes a DOM element as its argument. .replaceChild()尝试采用一个DOM元素并将其替换为另一个，并以DOM元素作为其参数。 That doesn't appear to be what you want to do at all here. 这似乎根本不是您要执行的操作。 It looks like what you want to do is take the value typed in the input field and put it into the <li> tag which you can do be setting the .innerHTML property. 看起来您想要做的就是将在输入字段中键入的值放入<li>标记中，您可以通过设置.innerHTML属性来完成此操作。
解决方案2
0 2014-02-02 15:38:14
See this is what you have to do 看到这就是你要做的
check this: http://jsfiddle.net/Pxhgw/ 检查此： http : //jsfiddle.net/Pxhgw/
<html>
<script>
function remplacer_ville(){
var ul = document.getElementById('liste');
var li = ul.getElementsByTagName('li');
var troisieme_ville = li[2];
var nouvelle_ville = document.getElementById('remplacement').value;
troisieme_ville.innerHTML = nouvelle_ville;
}
</script>
<body>
<ul id="liste">
<li>Paris</li>
<li>Marseille</li>
<li id="k">Lyon</li>
<li>Strasbourg</li>
<li>Bordeaux</li>
<li>Toulouse</li></ul>
<input type="button" value="onclick="remplacer_ville()"/><input
id="remplacement" type="text" onchange="remplacer_ville()"/><br /><br />
</body>
</html>
解决方案3
0 2014-02-02 17:38:29
Here is the fiddle answer 这是小提琴的答案
<ul id="liste">
<li>Paris</li>
<li>Marseille</li>
<li>Lyon</li>
<li>Strasbourg</li>
<li>Bordeaux</li>
<li>Toulouse</li>
</ul>
<input type="button" value="Change" onclick="remplacer_ville()" />
<input id="remplacement" type="text"/><br /><br />
with the function... 与功能...
function remplacer_ville(){
var ula = document.getElementById('liste');
var lia = ula.getElementsByTagName('li');
var troisieme_ville = lia[2];
var nouvelle_ville =
document.getElementById('remplacement').value;
troisieme_ville.innerHTML=nouvelle_ville;
};
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.