rob bentley
rob bentley

Reputation: 133

IE8 removes data attributes in title elements

Does anyone know why IE8 removes data- attributes from title tags when it loads a page? I haven't seen this behavior in any other browser.

If you load the following html in IE8 and check the DOM in Dev tools, the data data-title-attribute attribute has been removed.

<!DOCTYPE html>
<html>
    <head>
        <title data-title-attribute="Damn you IE8!">Title</title>
    </head>
    <body data-body-attribute="This works!"></body>
</html>

Upvotes: 3

Views: 1731

Answers (1)

Steven V
Steven V

Reputation: 16595

With a little some tinkering, it looks like IE8 removes any non-HTML4 attributes from the <title> tag when rendering.

As a workaround it looks like you can set/add any attribute once <title> has been rendered into the DOM. So the following does work in my tests:

<!DOCTYPE html>
<html>
    <head>
        <title id="title" data-title-attribute="Damn you IE8!">Title</title>
        <script>document.getElementById('title').setAttribute('data-title-attribute', 'Damn you IE8!');</script>
    </head>
    <body data-body-attribute="This works!"></body>
</html>

That would cause your data-* attribute(s) to be added to the title tag and be accessible via Javascript.

As for why it does that, I honestly think you've found a bug in IE8 because it does support data-* attributes in nearly every other location.

Upvotes: 2

Related Questions