Is there a way to have non-standard attributes like
onselectstart
oncontextmenu
...
in a tag, and still pass validation as HTML 4.01 transitional somehow?
Apart from adding the properties later on using Javascript.
Is there a way to have non-standard attributes like
onselectstart
oncontextmenu
...
in a tag, and still pass validation as HTML 4.01 transitional somehow?
Apart from adding the properties later on using Javascript.
Share Improve this question asked Nov 23, 2009 at 20:19 PekkaPekka 450k148 gold badges985 silver badges1.1k bronze badges 3- 1 Having valid markup does not really earn you any brownie points. A lot of developers these days seem to gain some false sense of pride when they see that 0 errors, but it's really meaningless. If your app functions properly in all modern browsers, pat yourself on the back; you've done all you need to do. – Josh Stodola Commented Nov 23, 2009 at 20:49
- Copied from my ment below: --- I have begun to care about validation even in the back-end because it makes it easier to detect errors. For a proper workflow, I want to see a green (validator) light somewhere when there is nothing to fix, and a red light when there is. That's why I want to remove even the smallest error, even though it is perfectly meaningless. – Pekka Commented Nov 23, 2009 at 20:53
- Related: stackoverflow./questions/209428/… – Ciro Santilli OurBigBook. Commented Jan 31, 2014 at 11:12
5 Answers
Reset to default 6While you can't add your own tags or attributes in HTML 4.01, a mon technique is using standard HTML tags or attributes to include your information, even if it isn't exactly the correct usage according to the spec. For example, the 'class' attribute can store almost any kind of data:
<a href="#" id="user-link-1" class="username:matt email:[email protected]">Matt</a>
You can retrieve the class of the link above and split the 'class' attribute up to retrieve your data.
Some other tags and attributes I've seen used for custom data: <script> tags with a non-JavaScript 'type' value, hidden input values, the 'title' attribute on various tags.
You have a couple of other options if you don't mind changing from HTML 4:
- use HTML 5, which supports custom attributes that start with 'data-'
- use XHTML, which support custom tags and attributes via an XML namespace.
You can also add custom attributes to your HTML document at runtime via JavaScript. For example:
var body = document.getElementsByTagName("body")[0];
body["my-attribute"] = "Hello, world!";
alert(body["my-attribute"]);
This can be helpful if your information is dynamic and doesn't need to be stored in the markup at all.
Using those attribute will produce an invalid document.
Adding those attributes later using Javascript will produce an invalid document (even if the W3C validator is unable to tell you so).
But W3C has never been against using proprietary extensions. Validation should not be a requirement. It is a way to tell you when you do not conform to the spec. W3C will not send the FBI just for an invalid page.
If you are relying on proprietary extensions to give your visitor a better experience (but not rely on it) then you are on the good path :-) Just pray (or contribute) for those to be in the next spec.
Now if it is about preventing browser context menu or selection, that's just rude! Don't do it!
No, you would have to change the doctype.
<!DOCTYPE HTML>
That doctype will allow you to use your own attributes. Heres a good article on the matter
No, it isn't. There is no scope for adding things to the language while still conforming to the language.
One thing I've done in the past is just use "data", which is monly used in slideshows etc. But write out the data you need the same way you would in the "style" attribute.
<div class="your_element" data="onselectstart:foo;oncontextmenu:bar;">
</div>
Then use jquery to grab the data:
var onSelectStart = getData($(".your_element"), "onselectstart");
The function:
//
function getData(elementObject, indexString)
{
var dataElements = elementObject.attr("data").trim().split(";");
var result = dataElements.some(function(entry) {
dataArray = entry.trim().split(":");
if(dataArray[0] == indexString)
{
found = dataArray[1].trim();
return true; // return from "some"
}
});
return result ? found : false;
}
Not being valid isn't the end of the world as a couple of others have mentioned. Like I said, "data" is monly used and it is even highlighted as valid in some IDEs.