jQuery Get Current Page Title

Share this article

jQuery code snippet to get the current web page full title and store it in a variable for use with other scripts. This is the title you see on your browser header.


jQuery(document).ready(function () {
	//using jquery
	var href = jQuery(location).attr('href');
	jQuery('#this_title').html('<strong>' + href + '');
	
	//using plain javascript
	var title = document.title;
});


Current page title: mytitle.

Another way suggested by Andy.
var current_href = $(location).attr('href');
var current_title = $(document).attr('title');

Frequently Asked Questions (FAQs) about jQuery and Page Titles

How can I use jQuery to get the title of the current HTML page?

To get the title of the current HTML page using jQuery, you can use the following code snippet:

var pageTitle = $(document).attr('title');
console.log(pageTitle);
This code uses the jQuery attr() method to get the value of the ‘title’ attribute from the document object, which represents the current HTML page. The title is then logged to the console.

Can I change the title of the current HTML page using jQuery?

Yes, you can change the title of the current HTML page using jQuery. Here’s how you can do it:

$(document).attr('title', 'New Title');
This code uses the jQuery attr() method to set the value of the ‘title’ attribute of the document object to ‘New Title’.

What is the difference between $(document).attr(‘title’) and $(‘title’).text() in jQuery?

Both $(document).attr(‘title’) and $(‘title’).text() can be used to get the title of the current HTML page in jQuery. However, there is a subtle difference between the two. The former gets the value of the ‘title’ attribute from the document object, while the latter gets the text content of the ‘title’ element. In most cases, both will return the same result.

Can I use jQuery to get the title of an external webpage?

Due to the same-origin policy in web browsers, you cannot use jQuery to directly get the title of an external webpage from the client side. However, you can use server-side programming languages like PHP or Node.js to send a request to the external webpage, get the HTML content, and then parse the title.

How can I use jQuery to get the URL of the current HTML page?

You can use the following jQuery code to get the URL of the current HTML page:

var pageURL = $(location).attr('href');
console.log(pageURL);
This code uses the jQuery attr() method to get the value of the ‘href’ attribute from the location object, which represents the URL of the current HTML page. The URL is then logged to the console.

Can I use jQuery to get the title of an iframe’s content?

Yes, you can use jQuery to get the title of an iframe’s content. However, due to the same-origin policy, this only works if the iframe’s content is from the same domain as the parent page. Here’s how you can do it:

var iframeTitle = $('iframe').contents().find('title').text();
console.log(iframeTitle);
This code uses the jQuery contents() method to get the content document of the iframe, then uses the find() method to find the ‘title’ element, and finally uses the text() method to get the title.

How can I use jQuery to set the title of an iframe’s content?

You can use the following jQuery code to set the title of an iframe’s content:

$('iframe').contents().find('title').text('New Title');
This code uses the jQuery contents() method to get the content document of the iframe, then uses the find() method to find the ‘title’ element, and finally uses the text() method to set the title.

Can I use jQuery to get the title of a specific element on the page?

Yes, you can use jQuery to get the title of a specific element on the page. Here’s how you can do it:

var elementTitle = $('#elementID').attr('title');
console.log(elementTitle);
This code uses the jQuery attr() method to get the value of the ‘title’ attribute from the element with the specified ID. The title is then logged to the console.

Can I use jQuery to change the title of a specific element on the page?

Yes, you can use jQuery to change the title of a specific element on the page. Here’s how you can do it:

$('#elementID').attr('title', 'New Title');
This code uses the jQuery attr() method to set the value of the ‘title’ attribute of the element with the specified ID to ‘New Title’.

Can I use jQuery to get the title of the current HTML page without using the attr() method?

Yes, you can use the following jQuery code to get the title of the current HTML page without using the attr() method:

var pageTitle = $('title').text();
console.log(pageTitle);
This code uses the jQuery text() method to get the text content of the ‘title’ element, which represents the title of the current HTML page. The title is then logged to the console.

Sam DeeringSam Deering
View Author

Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.

jQuery
Share this article
Read Next
Get the freshest news and resources for developers, designers and digital creators in your inbox each week
Loading form