Struppi: dynamisch links erstellen MIT onClick-Funktionalität

Beitrag lesen

<html><head><title>Test</title></head>
<body>
<ol id="Liste">
</ol>
<script type="text/javascript">
var liNummer = 0;

function insert(){
liNummer++;
var newLI = document.createElement("li");
var identifier = document.createAttribute("id");
identifier.nodeValue = "li"+liNummer;
newLI.setAttributeNode(identifier);

Du brauchst das Attribute nicht zu erzeugen, es existiert bereits.
D.h. es reicht:
newLI.id = "li"+liNummer

var newLILink = document.createElement("a");
var linkId = document.createAttribute("id");
linkId.nodeValue="link"+liNummer;
newLILink.setAttributeNode(linkId);
var linkHref = document.createAttribute("href");
linkHref.nodeValue="#";
newLILink.setAttributeNode(linkHref);

Hier das gleiche. Das href Attribut ist per Default bei einem A Element schon vorhanden

document.getElementById("li"+liNummer).appendChild(newLILink);

var newLinkText = document.createTextNode(' rem');
document.getElementById("link"+liNummer).appendChild(newLinkText);
document.getElementById("link"+liNummer).onClick=remove(liNummer);

Hier ist getelementById überflüssig, da du weiter oben ja schon das Element hast.

newLI.appenChild(....)

Dein Problem ist der onclick Event. Einmal heißt er "onclick" (Case sensitiv) und dann musst du diesem Handler eine Funktionsreferenz zuweisen und nciht den Rückgabewert einer Funktion.

In deinem Fall müßte es so gehen:
newLI.onclick = remove;

und die Funktion entpsrechend anpassen:

function remove()
{
document.getElementById("Liste").removeChild(this);
}

</script>
<a href="#" onClick="insert()">click</a>
</body></html>

Hier solltest du noch ein return false einfügen, da ansonsten zum Anker '#' gesprungen wird.

Struppi.