轉(zhuǎn)自: http://www.itokit.com/web/13/2008/11/11634.html

超鏈接的href 和onclick引發(fā)的思考.
1、在Baidu空間中的發(fā)現(xiàn)
空間是一個功能簡潔的Blog，但是它提供操作是比較方便的，一些常用的功能都使用模擬窗口作為界面，而不是要頁面跳轉(zhuǎn)或者新開窗口。& f* P- W- {0 r) f# s
我從HTML代碼里面找到了創(chuàng)建分類的鏈接代碼：
E% F
<a href=”/heero0w/creat/category/” target=”_blank” onClick=”openaddcat(’/heero0w/creat/category/’);return false;” tabindex=”-1″>增加新分類</a>:
這是一種非常健壯的代碼結(jié)構(gòu)，onclick里面的javascript代碼執(zhí)行后返回了false，相當于鏈接功能被屏蔽。但是，當 javascript被禁用或者onclick里面的代碼執(zhí)行出錯時，鏈接功能還是正常的。當網(wǎng)速很慢導(dǎo)致openaddcat函數(shù)的代碼還未被讀取時，單擊鏈接就會彈出了一個新頁面。因此，用戶點擊這個鏈接之后就不會出現(xiàn)什么都沒發(fā)生的情況，提高了用戶體驗
2、用同樣的思路進行SEO優(yōu)化
某些網(wǎng)站的列表頁使用了AJAX進行分頁，即換頁的時候只刷新列表的部分，而不是整頁刷新。代碼可能是
<a href=”###” onclick=”jumpPage(2)”>第二頁</a>

這種方式向來有一種缺點：SEO非常糟糕。搜索引擎基本上是不認識Javascript代碼的，所以它搜不到除了第一頁之后的內(nèi)容。按照上面的思路，我們需要給href加上一個有意義的鏈接，讓搜索引擎可以搜到該頁。改進如下：<a href=”?page=2″ onclick=”jumpPage(2);return false;”>第二頁</a>'
當然，這樣寫的前提是做兩份頁面，一份是AJAX分頁時的處理請求的頁面，另一份是常規(guī)分頁頁面。

3、改進
上面的鏈接代碼不符合HTML與Javascript分離的原則，而且在openaddcat未被讀取時按下鏈接的時候會導(dǎo)致瀏覽器報錯（雖然功能正常），改進的方法是后期動態(tài)添加事件。HTML修改如下：
<a href=”/heero0w/creat/category/” id=”newCate” target=”_blank” tabindex=”-1″>增加新分類</a>
在頁面底部寫上添加事件的腳本：[code]var newCate = document.getElementById(”newCate”);
var createCategory = function(e) {
  openaddcat(’/heero0w/creat/category/');
e = e || event;
e.preventDefault ? e.preventDefault() : e.returnValue = false;
return false;
};
if (newCate.addEventListener) { 
    newCate.addEventListener(”click”, createCategory, false);
} else if (newCate.attachEvent) {
newCate.attachEvent(”onclick”, createCategory);!
}[/code]