How javascript changes the title of a web page

This article mainly explains "javascript how to change the page title", the content of the article is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in depth, together to study and learn "javascript how to change the page title" bar!

Methods: 1, use "document.getElementsByTagName (" title ") [0] .innerText = 'value'"; 2, use "document.title=' value"; 3, use "$('title'). Html (' value").

The operating environment of this tutorial: windows7 system, javascript1.8.5 version, Dell G3 computer.

Title is a special node element in html because it can use document.getElementsByTagName ("title") [0] to get the title tag of a web page, but it cannot change its value with document.getElementsByTagName ("title") [0] .innerHtml. After testing, native js can be modified in two ways, and it can also be easily set up in jQuery. Now I would like to introduce to you.

InnerText mode

Through console.log (document.getElementsByTagName ("title") [0]), it is found that the label can be printed, and there are only text nodes in the label, so it can only be guessed that TextNode can be identified, so setting the value of title with innerText is a success.

Document.getElementsByTagName ("title") [0] .innerText = "value to be set"

Document.title mode

After testing, you can also set the value of title through document.title.

Console.log (document.title); # can get the value of title. Document.title = 'value to be set'; # set the value of title.

Examples

_ window.onfocus = function () {document.title = 'normal';}; _ window.onblur = function () {document.title = 'come back ~ the page crashed';}

When we change the value of title when the browser gains focus and loses focus, we can see that title changes when we switch browser tabs.

JQuery mode

Of course, if your project depends on jQuery, you can set it using the jq method.

$('title'). Html (' value') $('title'). Text (' value')

Both methods can be implemented in jq.

Summary

In native js, we can dynamically modify the title of a web page through innerText and document.title.

In jq, we can modify it with $('title'). Html (' value') or $('title'). Text (' value').

Thank you for your reading, the above is the content of "javascript how to change the page title", after the study of this article, I believe you have a deeper understanding of how to change the page title of javascript, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!