textNode - getElementById

matiro65 · 01. Mai 2014

Hallo liebe Leute,

unten stehender Code erzeugt nach Betätigung der "doSomething" - Schaltfläche wie erwartet drei Alert-Dialoge, mit folgenden Ausgaben:
[object HTMLDivElement]
[object HTMLButtonElement]
null

Warum "null" für das Textnode-Objekt?

Danke und Gruß - Matthias

Code:

<!DOCTYPE html>

<html>
<head>
</head>
<body>
<script>

function doSomething() {
    alert(document.getElementById('idDiv1'));
    alert(document.getElementById('idBtn1'));
    alert(document.getElementById('idTxt1'));
    }

    
window.onload = function() {
        
    var div1 = document.createElement('div'); 
    div1.id='idDiv1';

    var txt1 = document.createTextNode('hello world'); 
    txt1.id = 'idTxt1';
    
    var btn1 = document.createElement('button');
    btn1.id="idBtn1";
    btn1.appendChild(document.createTextNode("do something"))
    btn1.setAttribute("onclick", "doSomething()");
    
    document.body.appendChild(div1);
    div1.appendChild(txt1);
    div1.appendChild(btn1);
    }

</script>
</body>
</html>

kkapsner · 01. Mai 2014

Eine Textnode hat einfach keine ID und kann auch nicht darüber angesprochen werden. Wenn du auf Text zugreifen willst, musst du das immer über die umgebende Node machen.

PS: .setAttribute() sollte man bei Standardattributen - und besondern bei Eventlistenern - nicht verwenden. Bei dir sähe die saubere Methode so aus:

Code:

btn1.onclick = doSomething;

- ist auch noch kürzer.

textNode - getElementById

matiro65

New member

kkapsner

Super Moderator