超鏈接的href 和onclick引發的思考
當前位置:點晴教程→知識管理交流
→『 技術文檔交流 』
1、在Baidu空間中的發現
Baidu空間是一個功能簡潔的Blog,但是它提供操作是比較方便的,一些常用的功能都使用模擬窗口作為界面,而不是要頁面跳轉或者新開窗口。 剛開始用的時候空間里面沒有分類,但是在創建文章頁提供了一個創建分類的功能。當然,如前面提到的,這個功能是用模擬窗口作為界面。某天,家里的網速很慢,當我按下創建分類的鏈接時驚奇地發現新開了窗口而不是彈出一個模擬窗口。 我從HTML代碼里面找到了創建分類的鏈接代碼: <a href=”/heero0w/creat/category/” target=”_blank” onClick=”openaddcat(’/heero0w/creat/category/’);return false;” tabindex=”-1″>增加新分類</a> 這是一種非常健壯的代碼結構,onclick里面的javascript代碼執行后返回了false,相當于鏈接功能被屏蔽。但是,當 javascript被禁用或者onclick里面的代碼執行出錯時,鏈接功能還是正常的。當網速很慢導致openaddcat函數的代碼還未被讀取時, 單擊鏈接就會彈出了一個新頁面。因此,用戶點擊這個鏈接之后就不會出現什么都沒發生的情況,提高了用戶體驗。 2、用同樣的思路進行SEO優化 某些網站的列表頁使用了AJAX進行分頁,即換頁的時候只刷新列表的部分,而不是整頁刷新。代碼可能是 <a href=”###” onclick=”jumpPage(2)”>第二頁</a> 這種方式向來有一種缺點:SEO非常糟糕。搜索引擎基本上是不認識Javascript代碼的,所以它搜不到除了第一頁之后的內容。按照上面的思路,我們需要給href加上一個有意義的鏈接,讓搜索引擎可以搜到該頁。改進如下: <a href=”?page=2″ onclick=”jumpPage(2);return false;”>第二頁</a> 當然,這樣寫的前提是做兩份頁面,一份是AJAX分頁時的處理請求的頁面,另一份是常規分頁頁面。 3、改進 上面的鏈接代碼不符合HTML與Javascript分離的原則,而且在openaddcat未被讀取時按下鏈接的時候會導致瀏覽器報錯(雖然功能正常),改進的方法是后期動態添加事件。HTML修改如下: <a href=”/heero0w/creat/category/” id=”newCate” target=”_blank” tabindex=”-1″>增加新分類</a> 在頁面底部寫上添加事件的腳本: 該文章在 2010/8/14 2:25:27 編輯過 |
關鍵字查詢
相關文章
正在查詢... |