1. Definition
Eigenschaft: Eigentum, alle HTML -Elemente werden durch den HTMLelement -Typ dargestellt. Der HTMLelement -Typ erbt direkt von Element und fügt einige Attribute hinzu. Die hinzugefügten Attribute entsprechen jedem HTML -Element mit den folgenden 5 Standardmerkmalen: ID, Titel, Lang, Dir, ClassName. Ein DOM -Knoten ist ein Objekt, sodass er benutzerdefinierte Eigenschaften und Methoden wie andere JavaScript -Objekte hinzufügen kann. Der Wert der Eigenschaft kann ein beliebiger Datentyp sein, der für Fall sensibel ist, und die benutzerdefinierte Eigenschaft wird nicht im HTML -Code angezeigt, sondern nur in JS existiert.
Attribut: Die Funktion, die sich von der Eigenschaft unterscheidet, kann nur eine Zeichenfolge sein, die von Fall unempfindlich ist, in Innerhtml angezeigt, und alle Attribute können über Klassenarray-Attribute aufgeführt werden.
2. Ähnlichkeiten
Standard -DOM -Eigenschaften werden mit Attributen synchronisiert. Das DOM-Objekt wird als Eigenschaft ein anerkanntes (Nicht-Kunden-) Attribut hinzugefügt. Beispielsweise können ID, Ausrichtung, Stil usw. zu diesem Zeitpunkt die Eigenschaften durch Betriebseigenschaften oder DOM -Methoden wie GetAttribute () betrieben werden, die Betriebsmerkmale verwenden. Der an getattribute () übergebene Attributname entspricht jedoch dem tatsächlichen Attributnamen. Wenn Sie den charakteristischen Wert der Klasse erhalten, müssen Sie daher "Klasse" übergeben.
3.. Unterschiede
1). Für einige Standardmerkmale gibt es einen Unterschied in den Werten, die durch Getattribute und Punkt (.) Erhalten werden. Wie HREF, SRC, Wert, Stil, Onclick und andere Event -Handler.
2) .reif: GetAttribute erhält den tatsächlichen Wert von HREF, während Punkte die vollständige URL erhalten, die einen Browserunterschied hat.
Die Codekopie lautet wie folgt:
<Script>
var a = document.body.Children [0]
A.reif = '/'
alert ('Attribut:' + a.getAttribute ('href')) // '/'
alert ('Eigenschaft:' + a.href) // dh: '/', andere: volle URL
</script>
Der Wert von SRC ähnelt HREF, aber der IE wird auch eine vollständige URL zurückgeben.
Der Wertwert verfügt auch über einige integrierte Eigenschaften für die Synchronisation von "Einweg" (Einweg).
Beispielsweise Eingabe.Value synchronisiert vom Attribut (d. H. Die Eigenschaft erhält die Synchronisation vom Attribut)
Die Codekopie lautet wie folgt:
<Eingabe type = "text" value = "markup">
<Script>
var input = document.body.Children [0];
input.setAttribute ('value', 'neu');
alarm (input.Value); // 'neu', input.value geändert
alert (input.getatrriBute (Wert)); // 'neu'
</script>
Das Attribut kann jedoch keine Synchronisation aus der Eigenschaft erhalten:
Die Codekopie lautet wie folgt:
<Eingabe type = "text" value = "markup">
<Script>
var input = document.body.Children [0];
input.Value = 'new';
alert (input.getAttribute ('value')); // 'Markup', nicht geändert!
</script>
GetAttribute erhält den Anfangswert, während Punkte den Anfangswert oder den .value -modifizierten Wert erhalten. Wenn der Besucher beispielsweise bestimmte Zeichen eingibt, behält das 'Wert' Attribut den ursprünglichen Wert nach der Aktualisierung der Eigenschaft bei. Der ursprüngliche Wert kann verwendet werden, um zu prüfen, ob sich die Eingabe ändert, oder um ihn zurückzusetzen.
Bei Ereignishandlern wie Style und Onclick gibt die GetArttribute -Methode beim Zugriff eine Zeichenfolge zurück, während der Punkt die entsprechende Funktion des Objekt- und Ereignishandlers zurückgibt.
Für überprüfte Eigenschaften in der Eingabe
Die Codekopie lautet wie folgt:
<Script>
var input = document.body.Children [0]
alarm (input.Conted) // true
alert (input.getAttribute ('checked')) // leere Zeichenfolge
</script>
GetAttribute erhält den Wert, den Sie tatsächlich einstellen. Der Punkt gibt einen Booleschen Wert zurück.
Unterschiede in der Browserkompatibilität
1. In IE <9 Browsern können Sie Punktnummern und GetatTribute verwenden, um auf benutzerdefinierte Eigenschaften zwischeneinander zuzugreifen.
2. IE <8 (einschließlich IE8 IE7 -Kompatibilitätsmodus), Eigenschaft und Attribut sind gleich. Da das Attribut nicht fallempfindlich ist, wählt der Browser in diesem Fall bei Verwendung von GetArttribute, um auf die Funktion zuzugreifen, den zum ersten Mal angezeigten Wert aus.
Die Codekopie lautet wie folgt:
document.body.abba = 1 // Eigenschaft zuweisen (kann sie jetzt per GetatTribute lesen)
document.body.abba = 5 // Die Eigenschaft mit einem anderen Fall zuweisen
// muss eine Eigenschaft namens 'ABBA' in Fall-unempfindlicher Weise erhalten.
alert (document.body.getAttribute ('abba')) // 1
Prioritätseigenschaft
In den tatsächlichen Anwendungen verwenden 98% der DOM -Operationen Eigenschaften.
Es gibt nur zwei Situationen, die die Verwendung von Attributen erfordern
1. Passen Sie HTML -Attribute an, da es nicht mit der DOM -Eigenschaft synchronisiert ist.
2. Zugriff auf die integrierten HTML-Attribute, die nicht aus der Eigenschaft synchronisiert werden können. Zum Beispiel den Wertwert des Eingabe -Tags.