Question

我正在尝试使用JavaScript创建一个li并将其附加到现有的ol。我正在使用的代码是

<ol id=summaryOL>
</ol>

function change(txt) {
var x=document.getElementById("summaryOL");
newLI = document.createElementNS(null,"li");
newText = document.createTextNode(txt);
newLI.appendChild(newText);
x.appendChild(newLI);
}

change("this is the first change");
change("this is the second change");

这些看起来应该是：

1. this is ...
2. this is ...

但是看起来像：

this is the first changethis is the second change

我在fiddle创造了一个小提琴。谢谢你的帮助。

Answer 1

这是an example - jsfiddle

$(function() {
    var change = function( txt ) {
        $("#summaryOL").append( '<li>' + txt + '</li>' );
    };

    change("this is the first change");
    change("this is the second change");
});

要使用jquery ，请将以下代码放在＆lt; head＆gt;＆lt; / head＆gt;

中

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Answer 2

尝试下面。它对我有用。从
中删除null

newLI = document.createElementNS(null,"li");

function change(txt) {

    var x=document.getElementById("summaryOL");
    newLI = document.createElement("li");

    newText = document.createTextNode(txt);
    newLI.appendChild(newText);
    x.appendChild(newLI);
    alert('DONE');

    }

Answer 3

你的小提琴与你的问题无关......

在你的小提琴中，它工作正常，但你永远不应该有一个以数字开头的ID。

在您的问题中，createElementNS毫无意义 - 只需使用createElement('li')。

Answer 4

如果您使用的是jQuery，可以试试这个：

var item= "<li>" + "some info" + "</li>" ;
$("#items").html($("#items").html() + var);

显然附加到列表是另一种解决方案。

用于创建li并添加到ol的Javascript

4 个答案: