Warum ist Element ParentNode nicht definiert, wenn von innerhalb von document.ready() und window.load() zugegriffen wird?

Question

Ich habe ein <select> Element auf meiner Seite, die onchange propery gesetzt hat:

<select id="MySelect" onchange="return myOnChange(this);">Whatever</select> 

Der Event-Handler so geht:

function myOnChange(select) { 
    var parentNode = select.parentNode; 
    //whatever 
} 

Sobald die Seite der Benutzer die Auswahl ändert sich in der Drop-down-geladen ist und der Event-Handler wird aufgerufen und parentNode ist an etwas gebunden (was auch immer es ist, es ist nicht undefiniert und das ist genug).

Allerdings, wenn ich hinzufügen, ein document.ready():

$(document).ready(function() { 
    var select = $('#MySelect'); 
    var parentNode = select.parentNode; 
    //whatever 
}); 

oder window.load():

$(window).load(function() { 
    var select = $('#MySelect'); 
    var parentNode = select.parentNode; 
    //whatever 
}); 

dann einmal einer von ihnen aufgerufen wird, dann parentNode nicht definiert ist.

Warum ist das? Wie wird mein Handler aufgerufen, nachdem die Seite geladen wurde, sodass parentNode nicht undefiniert ist?

Answer 1

, weil hier kein ParentNode in einem jQuery-Objekt vorhanden ist.

var parentNode = select.parent() 

oder

var parentNode = select[0].parentNode; 

Answer 2

Sie sind ein Knotenobjekt Eigentum über ein jQuery-Objekt zugreifen,

var select = $('#MySelect'); 
var parentNode = select.parent(); 

Sie müssen jQuerys .parent() Funktion verwenden.

In Ihrem onchange Event-Handler erhalten Sie die this als Parameter. Grundsätzlich würde das this über ihr das Element darstellen, das das Ereignis aufruft. Und das wäre das Objekt node. So können Sie auf die Eigenschaft parentNode zugreifen. Aber nicht über ein jquery-Objekt.