js dynamically modify browser title

title is a special node element in html. Because it can use document.getElementsByTagName("title")[0] to get the content of the web page title tag, but its value cannot be changed using document.getElementsByTagName("title")[0].innerHtml. After testing, there are two ways to modify native js, and it can also be easily set in jQuery. Friends who are not sure can find out.

innerText method

Through console.log(document.getElementsByTagName("title")[0]), we found that <title># can be printed ## tag, there are only text nodes in the tag, so I guess it can only recognize TextNode, so I set the value of title using innerText method, and it succeeded.

<div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">document.getElementsByTagName(&quot;title&quot;)[0].innerText = '需要设置的值';</pre><div class="contentsignin">Copy after login</div></div><div class="contentsignin">Copy after login</div></div>document.title method

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

console.log(document.title);           # 可以获取title的值。
document.title = '需要设置的值';        # 设置title的值。

For example:

window.onfocus = function () {
  document.title = '恢复正常了...';
};
window.onblur = function () {
  document.title = '快回来~页面崩溃了';
};

We change the value of title when the browser gains focus and loses focus. You can find that when switching browser tabs,

title has changed.

jQuery method

Of course, if your project relies on jQuery, you can use the jq method to set it

$('title').html('')

$('title').text('')

Both methods can be implemented in jq

---

Summary

In native js, we can dynamically modify the

title of the web page in two ways: innerText and document.title In .jq, we can modify it through
$('title').html('') or $('title').text('').

title is a special node element in html. Because it can use document.getElementsByTagName ("title")[0] to get the title tag of the web page, but cannot use document.getElementsByTagName("title")[0].innerHtml to change it value. After testing, there are two ways to modify native js, and it can also be easily set in jQuery. Friends who are not sure can find out.

innerText method

Through

console.log(document.getElementsByTagName("title")[0]), we found that