js動態修改瀏覽器title

2021-09-14 07:05:07 字數 1265 閱讀 6921

titlehtml中屬於特殊的節點元素.因為它可以使用document.getelementsbytagname("title")[0]來獲取網頁的title標籤,但卻無法用document.getelementsbytagname("title")[0].innerhtml用更改它的值。經測試原生js有兩種方式可以修改,jquery中也能簡單設定。不清楚的小夥伴們可以了解一下。

通過console.log(document.getelementsbytagname("title")[0]),發現能列印出標籤,標籤裡面只有文字節點,故猜測只能識別textnode,所以用innertext方式設定title的值,果然成功了。

document.getelementsbytagname("title")[0].innertext = '需要設定的值';
經過測試,還可通過document.title設定title的值。

console.log(document.title);           # 可以獲取title的值。

document.title = '需要設定的值'; # 設定title的值。

舉個栗子:

window.onfocus = function () ;

window.onblur = function () ;

我們在瀏覽器取得了焦點和失去焦點的時候改變title的值,可以發現切換瀏覽器選項卡的時候,title發生了改變。

當然如果你的專案裡面依賴jquery,可以使用jq的方法設定

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

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

jq中兩種方式都可以實現

原生js中我們可以通過innertext,document.title兩種方式動態修改網頁的title.

jq中我們可以通過$('title').html('')或者$('title').text('')進行修改。

改進 js修改iOS微信瀏覽器的title

前端入門沒多久,可能連入門也不算,最近網上流行各自書籍改名,什麼 前端開發,從入門到放棄 android開發,從入門到改行 之類的,程式設計師真是個愛自嘲的群體,但我們一定是積極而向上的。說到web前端,瀏覽器差異是不可迴避的問題,這次的問題 知乎上的討論 如下 document.title the...

Vue專案新增動態瀏覽器頭部title

vue專案新增動態瀏覽器頭部title 1 從路由router裡面得到元件的title 在router.beforeeach to,from,next 裡面 const browserheadertitle to.name 2 title存vuexset browserheadertitle sta...

微信端瀏覽器title值的修改

若是pc端網頁 jquery方式 document attr title title html document attr title 我的頁面標題修改 title html 我的頁面標題修改 所以這裡修改了title後,立即建立乙個請求,載入乙個空的iframe,由於載入後立即就移除,不會對頁面造...