CODEWITHSUNDEEP
javascripthtml
VilleKoo
VilleKoo

Reputation: 2854

Is there a way to test if an html element can accept an attribute?

Ok so i could make an array of elements and test against it but that wouldn't be very practical.

I was wondering if there's a way to do something like:

if (el accepts attrName) do something.

EDIT: I'm referring to this list https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes

Upvotes: 0

Views: 424

Answers (3)

Casper Beyer
Casper Beyer

Reputation: 2301

You can test if the element type has the attribute as a property with the in operator.

var name = 'src';
var type = 'script';

if (name in document.createElement(type)) {
  console.log(type, 'has the attribute \'' + name + '\'');
} else {
  console.log(type, 'does not have the attribute \'' + name + '\'');
}

Note that, this tests if the object, an HTML element in this case has the property defined, not if its a valid HTML attribute for the element the object might represent, any property defined on the object will return true.

This means it has a couple of caveats, for example the class attribute is does not have a 1:1 mapping but is instead available via two properties, classList and className.

Upvotes: 0

Quentin
Quentin

Reputation: 943163

Browsers provide no API to tell you what attributes are recognised.

If you were to limit your requirements to HTML 3.2, HTML 4 or XHTML 1, then you could parse a DTD to get your list of supported attributes for each element. e.g. the HTML 4.01 Strict DTD. This would require that you find or write a JavaScript DTD parser.

HTML 5 doesn't provide an official machine readable spec. You could try parsing the table of data in the index (the format of which I note has changed between HTML 5 and HTML 5.1)

Of course with HTML 5 you also have to deal with the multiple-specs problem. The W3C publishes snapshots that you could use, and they are stable, but the WHATWG spec is "living" so will keep changing.

Validator.nu is open source so you could use their schema, but it follows the living spec and is both subject to change and frequently out of date.

And that only deals with standards. If you want to deal with what browsers actually support (given they sometimes introduce non-standard features and usually don't have a full implementation of any given spec) then you're mostly out of luck. You might have some success in reading the data from sites such as HTML 5 test and Can I use though.

And if you want to deal with things browsers don't support (i.e. what attributes they allow you to add to the DOM but will then ignore for anything that isn't code you wrote looking for them) then, as far as I know, everything is "accepted".

Upvotes: 3

elementzero23
elementzero23

Reputation: 1429

The interpretation of html attributes is browser-specific. One could implement a browser where <div> would accept foo as attribute. So if you try to test, whether <div> "accepts" foo as attribute, the result would depend on the browser.

Briefly: You can't.

Upvotes: 0

Related Questions