[jQ]如何存取網頁中的標題(Title)

有網友來信問說是否能存取網頁中的 Title 標籤的內容，我想應該是要用來動態設定網頁在瀏覽器中顯示的標題吧。既然都說是標籤了，那我們就能直接用 jQuery(TagName) 的 .text() 來存取其內容：

1
2
3

// Firefox, Chrome...OK
// IE 6~8...XD
$("title").text();

這樣的語法在 Firefox 及 Chrome 中都能順利取得內容，但...你知道的...IE 就是很不一樣，不管是 IE 6~8 都是取到空字串的內容。

筆者不死心的又用另三種方式來試試：

檢視原始碼 JavaScript

// IE 6~8, Chrome...OK
// Firefox...undefined
$("title").attr("innerText");
 
// IE 6~8, Firefox, Chrome...OK
$("title").html();
 
// IE 6~8, Firefox, Chrome...OK
$("title").attr("innerHTML");

ㄟ~看來要讓這幾個瀏覽器都能正常的是要用 .html() 或是 .attr("innerHTML") 的方式才行哩。那剛剛我們是 Get 的部份，現在我們再試試怎樣 Set：

檢視原始碼 JavaScript

// Firefox, Chrome...OK
// IE 6~8...Exception
$("title").text("男丁格爾's 脫殼玩");
 
// Chrome...OK
// IE 6~8...Exception
// Firefox...Nothing
$("title").attr("innerText", "男丁格爾's 脫殼玩");
 
// Firefox, Chrome...OK
// IE 6~8...Exception
$("title").html("男丁格爾's 脫殼玩");
 
// Firefox...OK
// IE 6~8, Chrome...Exception 
$("title").attr("innerHTML", "男丁格爾's 脫殼玩");

哇~~~看到結果就讓我頭痛了啦！！沒有一種方式是可以讓這些瀏覽器都能同時正常的設定。怎麼辦呢？難道要針對瀏覽器來寫不同的語法嗎？

唔...筆者記得之前用 JavaScript 來設定時，是使用 document.title 的方式來設定，這樣也就表示說， titlte 其實是 document 的一個屬性而已。既然是 document 的屬性，那麼要存取 title 時就是用 .attr("title") 的方式：

檢視原始碼 JavaScript

// IE 6~8, Firefox, Chrome...OK
$(document).attr("title");
 
// IE 6~8, Firefox, Chrome...OK
$(document).attr("title", "男丁格爾's 脫殼玩");

也許 jQuery 在處理 Title 時可能有些問題沒考慮到，但最後我們至少可以把它當成是 document 的屬性來存取就好。

範例 1

檔案描述
基本的範例檔案(免空)	開始下載
基本的範例檔案	會員限定

也許您對這些文章也有興趣

9 筆針對 [jQ]如何存取網頁中的標題(Title) 的迴響

bryan 於 2010-04-02 17:07:53 說：

精闢的說明解決了我的疑惑，常常拜讀男兄的JQ技術文件，真是獲益良多啊！

回覆 ↓
- 男丁格爾於 2010-04-02 17:24:08 說：
  
  你太客氣了..
  這些文章也算是筆記為主...畢竟人的大腦是不可靠的XD
  
  回覆 ↓
阿亮於 2010-07-27 14:40:06 說：

你好，本身剛接觸 jquery不是很久，也不是很熟，還正在研究中...
自己有做一個表單，是想讓網友在做交換連結的時候，貼上網址，就能連帶把 meta裡「description、keywords」等資訊秀出來寫入資料庫當中。

看過男兄的這篇文章，似乎只有抓取，但不是抓取
所以自己在網路上也有找到一些方式，但都沒有顯示出來。例如：我用 var description = $("meta[name=description]").attr("content");去擷取，但卻沒作用，想請問男兄像我們要抓取值，是要如何撰寫才正確，煩請解說，謝謝

回覆 ↓
- 男丁格爾於 2010-07-27 14:47:06 說：
  
  大小寫有差..你的 description 的 d 是小寫嗎..?
  我試著抓 meta 是 OK 的耶@@
  
  回覆 ↓
阿亮於 2010-07-27 14:42:28 說：

有字不見....
補充：似乎只有抓取title，但不是抓取meta

回覆 ↓
阿亮於 2010-07-28 11:14:14 說：

因為我是有用 curl去抓取某網頁，再抓取 meta值，如果是本頁的 meta值是正常的，只是我想要做的是擷取隨機貼入 input裡的連結後，再抓取該站的描述跟標題這樣。

其實我想做的是像這樣子頁面的東西啦 ^_^
http://www.sitebro.tw/register/step1/

回覆 ↓
- 男丁格爾於 2010-07-28 11:19:05 說：
  
  不然就是取到原始碼後在用正規表示法來過濾囉
  
  回覆 ↓
Law 於 2010-11-02 11:03:40 說：

jQuery 143 版似乎不能用$(document).attr("title") 來抓？？

回覆 ↓
- 男丁格爾於 2010-11-02 16:03:56 說：
  
  如果只是要取值的話，還是可以用 .html() 的方式。或者直接使用 document.title
  
  回覆 ↓

也許您對這些文章也有興趣

9 筆針對 [jQ]如何存取網頁中的標題(Title) 的迴響

發表迴響 取消回覆

發表迴響取消回覆