IE以及任何目前瀏覽器的標題欄,原本都應該是由<title>這個HTML標籤來控制的,當然現在仍然也是。只是目前的鬼趨勢是,你最好不要再刷新你的網頁頁面了,然後還需要接受用戶的任意蹂躪。這也就是傳說中神龍見首不見尾,殺人於無影無形的悖時Ajax技術!
在瀏覽器的標題列中顯示貼切的頁面標題,是一個網頁專業的表現,同時也能對搜尋引擎友善。當然如果放上適當的提示訊息,也會很有意義。那麼怎麼"動態"的來定制這個標題內容呢?
我們知道使用ASP動態修改瀏覽器title,大概是這樣的語句:
<title><% = GenerateTitle %></title>
而在ASP.NET 1.1中,除了仍可以使用上面的方法外,我們多了一個看起來"很美"的方法:
In aspx 頁:
<title id="cltTitle" runat="server"></title>
In CS file:
protected HtmlGeneralControl cltTitle;
. . .
cltTitle.innerHtml = "birdshome's homepage";
今天到了ASP.NET 2.0時代,除了上面的兩種方法,我們還可以更容易的修改<title>內容:
Page.Title = "birdshome's homepage";
不過上面的"動態"都是在伺服器端修改<title>的內容,實際上對於瀏覽器來說<title>標籤內的內容是完全固定的了。下面言歸正傳,仔細來說說在客戶端對IE瀏覽器標題列的控制:
對於IE視窗中的頁面,在頁面DOM物件中,document.title屬性是用來代替<title>元素的innerHTML取得和設定IE視窗標題列內容的。請看下面這個範例:
<html>
<body>
<!-- page content -->
<script language="javascript">
document.body.onload = function()
{
document.title = "birdshome's homepage";
};
</script>
</body>
</html>
對,就是這麼簡單就可以設定好普通IE視窗的標題列。那麼這有什麼好說的呢?這時候如果我們把完全相同的程式碼放入模態視窗中執行呢?模態視窗的標題列是否會被修改?試驗結果卻是讓人沮喪的,完全相同的這段程式碼,在模態視窗中就失靈了。模態視窗提供的DOM和普通視窗不同嗎?其實模態視窗的DOM和普通視窗是相同的,而不同之處是當模態視窗中的頁面裝載完成後,document.title屬性確實會失效。這就是為什麼在上面的範例程式碼onload事件中的語句無效的原因。解決這個限制的方法很簡單,就是要在頁面還未裝載完成時就修改document.title,所以在模態視窗中修改IE標題列就因該使用這樣的程式碼:
<html>
<body>
<!-- page content -->
<script language="javascript">
document.title = "birdshome's homepage";
</script>
</body>
</html>
以下是一個包含了以上兩種修改瀏覽器標題列方法的範例,將其儲存為"abc.htm"文件,使用IE開啟你就能很直觀看到區別:
<html>
<body>
<button onclick="foo()">
Open</button>
<script language="javascript">
document.body.onload = function()
{
document.title = "birdshome's homepage (rewrite)" + unescape(H_A0);
};
document.title = "birdshome's homepage (first)" + unescape(H_A0);
function foo()
{
window.showModalDialog("abc.htm");
}
</script>
</body>
</html>
結果是普通IE視窗的標題列會從"birdshome's homepage (first)"快速的變成"birdshome's homepage (rewrite)",而使用Open按鈕開啟的模態對話方塊的標題將永遠是"birdshome's homepage (first)"。從這個範例我們可以看出來,對於普通IE窗口,其標題列是可以在頁面生存期的任意時刻進行修改的。而模態視窗的標題欄,我們只能在其頁面裝載完成前(onload事件觸發前)才能修改。非模態對話框,opend by showModelessDialog,對於標題列的處理和模態對話框完全一樣。
最後再說一個document.title使用中的技巧,我們知道如果在伺服器端"動態"修改頁面title時,我們可以向<title></title>標籤間寫入&nbps;來在標題列上產生連續的空格輸入效果。這個技巧在模態視窗中特別有用,這樣一來我們就可以把那討厭的" - Web Page Dialog"字樣用連續空格推到標題列外去。使用document.title屬性來修改頁面標題列後,不管是普通視窗還是模態窗口," "和" "(空格)都不能用了,前者會被直接當字串顯示在標題列上,後者添加再多也只有一個" "(空格)的寬度效果。這裡我們又要使用另一個空格,實體 來解決這個問題。程式碼如下:
<html>
<body>
<script language="javascript">
var HexA0s = "%A0 %A0 %A0 %A0";
document.body.onload = function()
{
document.title = "birdshome's homepage (rewrite)" + unescape(HexA0s);
};
</script>
</body>
</html>
http://birdshome.cnblogs.com/archive/2006/06/23/control_browser_title.html