Heim >Web-Frontend >js-Tutorial >So ändern Sie den Seitentitel mit Javascript

So ändern Sie den Seitentitel mit Javascript

青灯夜游
青灯夜游Original
2021-10-20 15:55:282673Durchsuche

Methode: 1. Verwenden Sie "document.getElementsByTagName("title")[0].innerText = 'value'" 2. Verwenden Sie "document.title='value'"; .html('Wert')".

So ändern Sie den Seitentitel mit Javascript

Die Betriebsumgebung dieses Tutorials: Windows 7-System, JavaScript-Version 1.8.5, Dell G3-Computer.

title ist ein spezielles Knotenelement in HTML, da es document.getElementsByTagName("title")[0] verwenden kann, um das Titel-Tag der Webseite abzurufen, aber nicht document.getElementsByTagName("title")[0].innerHtml wird verwendet, um seinen Wert zu ändern. Nach dem Testen gibt es zwei Möglichkeiten, natives JS zu ändern, und es kann auch einfach in jQuery festgelegt werden. Lassen Sie mich es Ihnen unten vorstellen.
document.getElementsByTagName("title")[0]来获取网页的title标签,但却无法用document.getElementsByTagName("title")[0].innerHtml用更改它的值。经测试原生js有两种方式可以修改,jQuery中也能简单设置。下面给大家介绍一下。

innerText 方式

通过console.log(document.getElementsByTagName("title")[0]),发现能打印出b2386ffb911b14667cb8f0f91ea547a7标签,标签里面只有文字节点,故猜测只能识别TextNode,所以用innerText方式设置title的值,果然成功了。

document.getElementsByTagName("title")[0].innerText = '需要设置的值';

document.title方式

经过测试,还可通过document.title 设置title的值。

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

例子

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

我们在浏览器取得了焦点和失去焦点的时候改变title的值,可以发现切换浏览器选项卡的时候,title发生了改变。

jQuery方式

当然如果你的项目里面依赖jQuery,可以使用jq的方法设置

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

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

jq中两种方式都可以实现

总结

原生js中我们可以通过 innerText , document.title 两种方式动态修改网页的title .

jq中我们可以通过 $('title').html('值') 或者 $('title').text('值')

innerText-Methode

Durch console.log(document.getElementsByTagName("title")[0] habe ich herausgefunden, dass das Tag b2386ffb911b14667cb8f0f91ea547a7 Es enthält nur Textknoten, daher kann es vermutlich nur TextNode erkennen. Daher verwende ich innerText, um den Wert des Titels festzulegen, und es ist erfolgreich.

rrreeedocument.title-Methode

Nach dem Testen kann der Wert von title auch über document.title festgelegt werden. 🎜rrreee🎜Beispiel🎜rrreee🎜Wir ändern den Wert des Titels, wenn der Browser den Fokus erhält und den Fokus verliert. Sie können feststellen, dass sich der Titel ändert, wenn Sie zwischen den Browser-Registerkarten wechseln. 🎜🎜jQuery-Methode
🎜🎜Wenn Ihr Projekt auf jQuery basiert, können Sie es natürlich mit der jq-Methode festlegen🎜rrreee🎜Beide Methoden können in jq implementiert werden🎜🎜Zusammenfassung
🎜🎜In nativem JS können wir den Titel der Webseite auf zwei Arten dynamisch ändern: innerText und document.title.
🎜🎜jq Wir können es durch $('title').html('value') oder $('title').text('value'). 🎜🎜Das Obige ist die detaillierte Methode zum Ändern des Browsertitels mit JS. Wenn Sie es nützlich finden, speichern Sie es einfach. 🎜🎜Weitere Kenntnisse zum Thema Programmierung finden Sie unter: 🎜Programmiervideos🎜! ! 🎜

Das obige ist der detaillierte Inhalt vonSo ändern Sie den Seitentitel mit Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn