HTML5 tutorial: html tag attributes are verified by w3c

Article introduction of Wulin.com (www.vevb.com): The html tag uses user attributes to pass w3c verification.

Yesterday, a friend's project, the customer needed to pass W3C verification (maybe you think this is a very fucking thing, but I also think so, browser compatibility is the bottom line, but the customer has been dead for many years but people still think that he is still alive. Westerners call God-god, and dogs are just one ri away. If their needs are not met, there is no way to do so). But he wrote some user attributes in the tag, so he couldn't get it. I asked me about the solution and thought of some ways to give it to him.

First, let me explain what user attributes are. If you are a master, you don’t need to read them. <tag yourAttr=yourAttrValue ></tag>. The red part is the user attributes. Sometimes when we need to use javascript code to create something, this is essential. But he really cannot pass the W3C verification.

Here are some solutions I can think of:

1. Use sub-tags to hide them instead of user attributes.

<tag class=normal>

<tag class=myAttr>myAttrValue</tag>

<tag>Content</tag>

</tag>

Then set css

.myAttr{display:none;}

How to get that data, you can check it yourself.

2. Use HTML5 DTD + data- to solve it

html5 supports user-defined properties, but requires that it must start with data- and can pass verification.

<tag data-myAttr=myAttrValue></tag>

3. Use common attributes to solve

The title attribute is available for most tags and can be verified completely.

<tag title=myAttrValue></tag>

However, the problem is that when the mouse moves to the tag, the title is displayed directly, which is a very bad user experience.

So, I thought of using javascript or jquery to solve this problem:

(function($){

$.fn.setUserAttr=function(options){

var defaults={dataName:userData};

var opts = $.extend({},defaults,options||{});

return this.each(function(){

$this=$(this);

var userAttrVal=$this.attr(title);

$this.attr(title,).data(opts.dataName,userAttrVal);

})

};

})(jQuery)

html:

<tag class=useAttr title=myAttrValue></tag>

application:

$(.useAttr).setUserAttr();

Get data through $(.useAttr).data(userData).

or

$(.useAttr).setUserAttr({dataName:yourAttrName});

Get data through $(.useAttr).data(yourAttrName )

Of course, it's just some personal thoughts.