JavaScript DOM-2 Read and modify node information (node information, element content, attributes)

One, node information

Node name NodeName

-NodeName: Name of the node, String Type property

-NodeName is read-only

650) this.width=650; "src=" Http://s2.51cto.com/wyfs02/M01/7E/5A/wKiom1b88UWTDNTpAADjD9KdoQE267.png "title=" Web.png "alt=" Wkiom1b88uwtdntpaadjd9kdoqe267.png "/>

Node Type NodeType

-NodeType: Node type, Number Type property

650) this.width=650; "src=" Http://s2.51cto.com/wyfs02/M02/7E/56/wKioL1b88iXQksvRAAC36oQIVFo588.png "title=" Web.png "alt=" Wkiol1b88ixqksvraac36oqivfo588.png "/>

Node Value NodeValue

-NodeValue: The value of the node, String Type property

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M02/7E/5A/wKiom1b88bGwsAjpAADIiffbajo878.png "title=" Web.png "alt=" Wkiom1b88bgwsajpaadiiffbajo878.png "/>

Ii. content of elements

HTML Content

-The innerHTML property of the element node object reads or sets the HTML content in the element node

650) this.width=650; "src=" Http://s5.51cto.com/wyfs02/M02/7E/57/wKioL1b88xywjp8jAAFK4DBARGo879.png "title=" Web.png "alt=" Wkiol1b88xywjp8jaafk4dbargo879.png "/>

Text content

-The Textcontent property of the Element node object is used to read or set the text content in the element node----child HTML tags will be kicked apart

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M00/7E/5A/wKiom1b88tbyHA8tAAGp__AVlCw870.png "title=" Web.png "alt=" Wkiom1b88tbyha8taagp__avlcw870.png "/>

NodeValue and Textcontent

650) this.width=650; "src=" Http://s5.51cto.com/wyfs02/M01/7E/5A/wKiom1b88wLBbrbFAADdzyvWe20321.png "title=" Web.png "alt=" Wkiom1b88wlbbrbfaaddzyvwe20321.png "/>650" this.width=650; "src=" http://s2.51cto.com/wyfs02/M00/ 7e/57/wkiol1b887qikg0uaadthpzdu3o246.png "title=" Web.png "alt=" Wkiol1b887qikg0uaadthpzdu3o246.png "/>

Controversial InnerText

-There is no innertext attribute in the standard DOM operation;

-IE8 The previous IE browser does not support the standard Textcontent property, using innertext to achieve similar functionality, this property is currently compatible with most browsers, but Friefox still does not support this property

-InnerText is not exactly the same as the standard textcontent attribute

650) this.width=650; "src=" Http://s4.51cto.com/wyfs02/M00/7E/57/wKioL1b89PLigMZgAAE3ZDhi8T0616.png "title=" Web.png "alt=" Wkiol1b89pligmzgaae3zdhi8t0616.png "/>

Third, attribute

Property Collection

-The Attributes property of the element node returns a collection of properties for the node, that is, namesnodemap----a class array object

650) this.width=650; "src=" Http://s1.51cto.com/wyfs02/M00/7E/57/wKioL1b89b7jA9mTAAGJ4D9P0kc035.png "title=" Web.png "alt=" Wkiol1b89b7ja9mtaagj4d9p0kc035.png "/>

Read properties

-You can read the value of a property in several ways:

-element.attributes[Subscript].value

-element.attributes[' property name ']

-Element.getattributenode (' attribute name '). Value

-Element.getattribute (' attribute name ')

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M02/7E/57/wKioL1b8-0_Ak36BAAC6O0ZpdP0470.png "title=" Web.png "alt=" Wkiol1b8-0_ak36baac6o0zpdp0470.png "/>

modifying properties

-You can set the attributes of an element using the following methods:

-Element.setattribute (Name,value); This method is not supported for IE8 and the following versions

-Element.setattributenode (Attrnode);

650) this.width=650; "src=" Http://s5.51cto.com/wyfs02/M02/7E/57/wKioL1b8_Gyg2VgIAADN74gEbtc466.png "title=" Web.png "alt=" Wkiol1b8_gyg2vgiaadn74gebtc466.png "/>

removing properties from

-You can delete a property in the following two ways:

-Element.removeattribute (' attribute name ');

-Element.removeattributenode (Attrnode);

650) this.width=650; "src=" Http://s2.51cto.com/wyfs02/M00/7E/57/wKioL1b8_PSiEvOPAADuq0euINg476.png "title=" Web.png "alt=" Wkiol1b8_psievopaaduq0euing476.png "/>

Judging attributes

-The following method can be used to determine whether an element has the specified attribute:

-Element.hasattribute (' attribute name '); True or False

-Element.hasattributes (); If you have properties//IE8 and the following versions do not support this method

650) this.width=650; "src=" Http://s5.51cto.com/wyfs02/M00/7E/5C/wKiom1b8_NXRqLYUAABbNBnSWz8088.png "title=" Web.png "alt=" Wkiom1b8_nxrqlyuaabbnbnswz8088.png "/>

Summary: This chapter focuses on the JavaScript DOM reading and modifying node information (node information, element content, attributes)

This article from the "Technical Exchange" blog, declined reprint!

JavaScript DOM-2 Read and modify node information (node information, element content, attributes)