CODEWITHSUNDEEP
javascriptjqueryhtml
jgg
jgg

Reputation: 1136

IE issue while replacing title tag content with another title tag content using jquery

I have a page where it has two title tags (this is due to at run time we include a page in another page). Currently I am seeing first title tag value in the browser but I want to show second title tag's value. Here is the code I have, this is working fine in Firefox and Chrome but not in IE7. Any suggestions?

var titleName;
$(document).find('title').each(function(){
    titleName = $(this).text();
});
$(document).attr("title", titleName);

Upvotes: 0

Views: 813

Answers (2)

Tom Brothers
Tom Brothers

Reputation: 6007

You can’t get the value of the second title because IE doesn't include it in the DOM.

Upvotes: 1

Intelekshual
Intelekshual

Reputation: 7566

You don't need jQuery for this. It should work in IE (as well as all other browsers) using vanilla JavaScript.

document.title = 'new title';

Because of how IE handles the <title> element, you'll need to give it a little extra help in getting the second value.

var titleName;
// find all title elements using plain ol' javascript
var titles = document.getElementsByTagName('title');

// iterate over array of titles
$.each(titles, function(i, title) {
    // if there are childNodes, then we know we're not in IE
    if (!!title.childNodes.length) {
        titleName = title.firstChild.data;
    }
    // in IE, we can read the title elements innerHTML, but we can't set it
    else if (title.innterHTML) {
        titleName = title.innerHTML;
    }
});
// finally, set the document title
document.title = titleName;

The major issue here is that the title element in IE doesn't have any child nodes, so $(this).text() won't work.

Let me know if the above code works for you.

Upvotes: 1

Related Questions