“This is the 21st day of my participation in the Gwen Challenge in November. See details: The Last Gwen Challenge in 2021”
Element type
The Element type is the most commonly used type in Web development, providing external access to Element tag names, child nodes, and attributes
Element nodes have these characteristics:
- nodeType = 1
- NodeName is the tag name of the element
- NodeValue value is null
- ParentNode is a Document/Element object
- Child nodes can be of type Element/Text/Comment, etc
We can get the tagName of the element by using nodeName/tagName. Both attributes return the same value (the tagName attribute is more semantic and easier to understand).
Take into account the behavior between different browsers in fetchingtagNameWhen comparing HTML tag types, you are advised to change the value to lowercase or larger
HTML tags
Basic attributes
All HTML elements are of type HTMLElement, which inherits from Element with some attributes added before it
HTML elements have the following attributes:
- Id, the unique identification of the element within the document
- Title, the prompt displayed when the mouse hovers over the element
- Lang, language code for element content (rarely used)
- Dir, the direction of language writing, LTR from left to right and RTR from right to left, are also rarely used
- ClassName, the class attribute, specifies the CSS style of the element.
Get basic attributes
All of the above attributes can be passed through the element. Property
If the attribute is not used in the tag, the corresponding fetch operation returns null characters
If there are multiple CSS styles on a tag, mydiv.className actually returns the value of the class attribute as a string
Basic property changes
We can treat the attribute as a variable and give it a string value directly
The above illustration only shows that the corresponding property does change, but the following example, using className, demonstrates that property changes are actually updated to the DOM node in real time
