TypeError: node.setAttribute keine Funktion

Ich erhalte eine Fehlermeldung: "TypeError: item.setAttribute keine Funktion", wenn ich versuche, rufen Sie die folgende Funktion auf meiner Webseite:

function list() {
    var colors = document.getElementById('colors');
    var colors = colors.childNodes.length;
    for (var i = 1; i < broj; i++) {
        var item = colors.childNodes.item(i);
        item.setAttribute("id", i);
        item.setAttribute("onmouseover", "moveover(src)");
        item.setAttribute("alt", "Color");
        item.hspace = "2";
        item.height = "23";
    }
}

function moveover(colorAddress) {
    var source = colorAddress;
    var image = source.slice(0, source.length - 4);
    var start = "url(";
    var extension = ".jpg)";
    var newImage = start.concat(image, extension);
    document.getElementById('image').style.backgroundImage = newImage;
}

window.onload = function() {
    try {
        list();
    } catch (err) {
        alert(err);
    }
}

Den mouseover() Funktion ist eine Hilfsfunktion für die list() Funktion auslösen soll, wenn das Ereignis onmouseover - Attribut Hinzugefügt, um das element in der list() Funktion.

Wenn ich es lade meine Seite " alert-box erscheint und gibt mir den obigen Fehler.

Ist es eigentlich das hinzufügen der Attribute für Elemente von mir, aber ich verstehe nicht, warum diese Fehler auftauchen. Da dieser Fehler ausgelöst wird es hindert mich daran, mit einer anderen Funktion direkt nach dieser Lasten.

Warum wird dieser Fehler angezeigt?

Hier ist das HTML-Dokument, das ich bin versucht zu manipulieren:

<div id="image" style="background-image: url(images/nova_brilliant/1.jpg)"></div>
<div id="tekst">
     <h1>Nova Brilliant</h1>

    <div id="contents">
        <p>Hover with your mouse over the desired color to see the kitchen in that color:</p>
        <div id="colors">
            <img src="images/nova_brilliant/1.gif">
            <img src="images/nova_brilliant/2.gif">
            <img src="images/nova_brilliant/3.gif">
        </div>
        <p>Other available colors:</p>
        <div id="others">
            <img src="images/nova_brilliant/4.gif">
            <img src="images/nova_brilliant/5.gif">
            <img src="images/nova_brilliant/6.gif">
        </div>
    </div>
</div>

Wenn ein Benutzer mit der Maus mit der Maus über eines der 3 Bilder im div mit der id="colors" hintergrund Bild in das div mit der id="image" sollte sich ändern und das tut es wirklich ändern, es ist nur, dass ich bekommen, dass lästige Fehler, die mich daran hindert, läuft ein script sobald das einer lädt.

Hinzufügen der HTML würde auch helfen

InformationsquelleAutor SineLaboreNihil | 2013-03-28

  1. 7

    Chancen stehen, dass der Knoten, auf den Sie hier aufrufen setAttribute() ist ein text-Knoten eher als ein element. Die einfachste Lösung ist, überprüfen Sie die nodeType Eigenschaft vor dem aufrufen von setAttribute():

    var item = colors.childNodes[i];
if (item.nodeType == 1) {
    //Do element stuff here
}

    Nebenbei: einstellen von Ereignis-handler-Attribute wie onmouseover über setAttribute() ist allgemein eine schlechte Idee, weil es nicht funktioniert wie angegeben, in älteren IE (und Kompatibilität in späteren IE). Verwenden Sie die entsprechende Eigenschaft statt:

    item.onmouseover = function() {
    moveover(this.src);
};
    Ich danke Ihnen sehr. Das war genau das problem und es gelöst. 🙂

    InformationsquelleAutor Tim Down

Schreibe einen Kommentar