Ιδιότητα style του στοιχείου HTML DOM

Ορισμός και χρήση

style Ιδιότητα επιστρέφει την τιμή του style attribute του στοιχείου ως αντικείμενο CSSStyleDeclaration.

Το αντικείμενο CSSStyleDeclaration περιέχει όλες τις ιδιότητες στυλ inline του στοιχείου. Δεν περιέχει τις ιδιότητες στυλ που βρίσκονται σε <head> Τμήματα ή οποιεσδήποτε εξωτερικές таблицες στυλ που έχουν ρυθμίσει οποιεσδήποτε ιδιότητες στυλ.

Σημείο 1

Δεν μπορείτε να ρυθμίσετε τέτοιους στυλ:

element.style = "color:red";

Δε πρέπει να χρησιμοποιείτε τέτοιες ιδιότητες CSS:

element.style.backgroundColor = "red";

Προσπαθήστε να το δοκιμάσετε προσωπικά

Σημείο 2

Η γραμματική JavaScript και CSS είναι κάπως διαφορετική:

backgroundColor / background-color

Δείτε το: Πλήρης οδηγός Object Style.

Σημείο 3

Χρησιμοποιήστε αυτή την ιδιότητα style αντί: Μέθοδος setAttribute()για να αποφύγετε την αντικατάσταση άλλων ιδιοτήτων του style attribute.

Δείτε επίσης:

Εκμάθηση CSS

Εγχειρίδιο CSS

Όν Object Style

HTML <style> Ετικέτα

Παράδειγμα

Παράδειγμα 1

Αλλάξτε τον χρώμα του "myH1":

document.getElementById("myH1").style.color = "red";

Προσπαθήστε να το δοκιμάσετε προσωπικά

Παράδειγμα 2

Αποκτήστε την τιμή του πάνω περιγράμματος του "myP":

let value = document.getElementById("myP").style.borderTop;

Προσπαθήστε να το δοκιμάσετε προσωπικά

Γραμματική

Επιστροφή ιδιότητας style:

στοιχείο.style.ιδιότητα

Ρύθμιση ιδιότητας style:

στοιχείο.style.ιδιότητα = τιμή

Τιμή ιδιότητας

Τιμή Περιγραφή
τιμή

Καθορισμός τιμής ιδιότητας.

Παράδειγμα:

element.style.borderBottom = "2px solid red"

Αποτελεσματική τιμή

Τύπος Περιγραφή
Όν Το αντικείμενο CSSStyleDeclaration του στοιχείου.

Υποστήριξη περιηγητών

element.style Είναι χαρακτηριστικό DOM Level 2 (2001).

Όλοι οι περιηγητές το υποστηρίζουν πλήρως:

Χρώμη IE Ετζ Φαξφόρ Σάφάρι Οπερά
Χρώμη IE Ετζ Φαξφόρ Σάφάρι Οπερά
Υποστήριξη 9-11 Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη