Parsing Custom Attributes of html elements using JavaScript/Js scripts (compatible with Firefox and IE) _ javascript skills

This article mainly introduces in detail the parsing of Custom Attributes of html elements processed by JavaScriptJs scripts (which is compatible with Firefox and IE). For more information, see, we hope to help you with HTML elements, which are rich in attributes. However, in some cases, it may be too slow. At this time, Custom Attributes play a key role.

It is very convenient to use custom attributes of Html elements, for example:

Suppose we need to limit it now. This button can only be clicked twice and then becomes invalid.

The general implementation method is to use global variables to record the number of clicks, but here we use custom attributes to implement this function, to show the advantages of custom attributes; let's make a transformation to the above button:

As you can see, I added a custom attribute clickCount for this button and set the initial value to 0. Below we will write the js Code that implements the function:

1. Add a click event to the button.

2. Let's write the customAttributeDemo (obj) function.

For IE, it is very simple to use custom attributes, because IE automatically resolves the custom attributes to the DOM, and there is no difference with the standard attributes. The version of IE is as follows:

The Code is as follows:

Function customAttributeDemo (obj)
{
If (obj. clickCount = '0 ')
{
Obj. clickCount = '1 ';
}
Else
{
Obj. disabled = true;
}
}

The above code will expire in FireFox, because FireFox has a higher limit on the use of custom attributes and can only be accessed using the attributes [] set. The code in FireFox:

The Code is as follows:

Function customAttributeDemo (obj)
{
If (obj. attributes ['clickcount']. nodeValue = '0 ')
{
Obj. attributes ['clickcount']. nodeValue = '1 ';
}
Else
{
Obj. disabled = true;
}
}

The above Code also applies to IE. Therefore, this code is compatible code.

Thanks to the discussion, he gave the getAttribute and setAttribute methods:

The Code is as follows:

Function customAttributeDemo (obj)
{
If (obj. getAttribute ('clickcount') = '0 ')
Obj. setAttribute ('clickcount', '1 ');
Else
Obj. disabled = true;
}