HTML tag Properties (attribute) and DOM element properties (property)

Attribute and property all have attribute meanings, but it is not difficult to distinguish between attribute and properties. From an object, attribute is a label attribute on an HTML document,

The property is the self-attribute of the corresponding DOM element. From an operational approach, attribute can be passed through the DOM core specification interface GetAttribute and setattribute

To get the modifications, and the property can access the properties through the object. or [""] to modify the fetch.

However, for ie6,7,8 (Q) mode, there is a compatibility issue with the standard Web browser:

1, under ie6,7,8 (Q), these two methods are equivalent, namely getattribute and ". || ["]" can access the tag attributes on the HTML or the unique properties of the DOM object ( typically:

The innerHTML and Offsetwidth,clientwidth properties of DOM elements can be obtained through getattribute, or through setattribute settings;

They set such custom properties on the HTML document according to the specification, and do not modify the properties of the DOM elements , but in the Web browser can correctly distinguish their similarities and differences;

2, under ie6,7,8 (Q), the Value property of the input type Text,password,file can be accessed through getattribute and setattribute, and only

The acquisition can be set by the form of the object property;

3, under ie6,7,8 (Q), "class" cannot be set correctly by setattribute, i.e. setattribute ("Class", "Show") is unsuccessful, through GetAttribute ("class")

will be null, compatible through setter (getter) classname;

4, under ie6,7,8 (Q), the "style" cannot be set correctly by SetAttribute, and the getattribute ("style") will not return a string (domstring), but

Cssstyledeclaration object, Style.csstext compatible with setter (getter);

5, under ie6,7,8 (Q), the event handler cannot be set through SetAttribute, SetAttribute (' onclick ', function () {...} ) failure

Analysis:

The DOM core specification states that the element node implements the GetAttribute and SetAttribute interfaces, but for specific DOM elements, such as Div, he implements an interface that is

Htmldivelement, while the Htmldivelement interface inherits from the HtmlElement interface, HtmlElement implements the DOM (HTML) specification (which can be seen as a DOM core extension,

For an object-specific description of HTML and XHTML, the DOM (HTML) specification indicates the correspondence between the property of the DOM element attribute and the HTML tag attribute, respectively Id,dir,lang,title

, ClassName. In the HTML parsing phase, the browser binds the tag attribute of HTML to the property of the corresponding DOM element, so that modifying the properties of any DOM element will

Rendered on the Label property.

　　

For input (type=text|password|file), its value can be understood as two, one is the Value property explicitly set on the input label, and the other is by

The currentvalue of the input and the change. The DOM Level 2 HTML specification states that when the INPUT element type property is "text", "file", or "password", its corresponding

The Value property of the Htmlinputelement object represents the control "CurrentValue", and modifying this property alters the control's "current value", but does not change the Value property on its HTML tag.

According to the description in the HTML4.01 specification, the Value property on an INPUT element's HTML tag specifies the "CurrentValue" of the control. The original "Current value" takes "initial value".

HTML tag Properties (attribute) and DOM element properties (property)