JavaScript中平穩(wěn)退化graceful degradation的示例分析

小編給大家分享一下JavaScript中平穩(wěn)退化graceful degradation的示例分析，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

所謂平穩(wěn)退化，就是指可以讓訪問者在瀏覽器不支持javascript或者禁用了JavaScript的時候依舊可以順利的瀏覽你的網頁；即，雖然有些功能無法使用，但基本操作依舊可以順利完成。

這里用在新窗口打開一個鏈接作為例子，我們知道js打開新窗口的方法：

window.open(url,name,features)

在這里，url是要打開的網頁的url地址，name是新窗口的名字，最后的features是一系列的參數

好，現在寫一個簡單的函數：

function openwindow(winUrl){ 
window.open(winUrl,"new window","width = 320 , height = 480") 
}

然后可以使用偽協議調用該函數：

<a href = "javascript:openwindow('http://www.google.com');">google</a>

這樣的做法，可以在支持“JavaScript:”偽協議的瀏覽器里正常運行，不支持JavaScript的瀏覽器會嘗試打開鏈接但失敗，而在禁用了JavaScript功能的瀏覽器里什么都不會做；

另一種做法是使用onclick：

<a href = "#" onclick = "openwindow('http://www.google.com');return false;">google</a>

在這里"#"代表著一個空鏈接，加入了return false之后，<a>標簽不會跳轉到href指定的鏈接，在這里實際工作都在onclick里執(zhí)行。但是這樣做在禁用了JavaScript功能的瀏覽器里依舊無法打開。

那么怎樣可以解決這個問題呢，其實只需要：

<a href = "http://www.google.com" onclick = "openwindow(http://www.google.com);return false;">google</a>

或者：

<a href = "http://www.google.com" onclick = "openwindow(this.href);return false;">google</a>

我們使用onclick去執(zhí)行JavaScript的函數，但是在href屬性里也確實填寫了url，這樣，如果是在禁用了JavaScript 的瀏覽器里，雖然不能打開一個新窗口，在新窗口里打開連接，但是至少是可以跳轉到目標網頁的（當前頁面）；

最后說一下為什么要使用平穩(wěn)退化，可能會有這樣的想法：讓那些禁用了或者不支持JavaScript的瀏覽器順利訪問你的網站有那么重要嗎，畢竟現在使用不支持JavaScript或者總是禁用JavaScript功能的用戶應該是已經非常少的了。

確實這樣的用戶已經非常少了，但是它很重要；

這個用戶可能是一個搜索機器人——一種自動化程序，他們?yōu)g覽各個網頁的目的只是為了加入到搜索引擎的數據庫里，各大搜索引擎都有類似的程序，但是大多數的搜索機器人無法理解JavaScript代碼，所以如果你的網頁無法平穩(wěn)退化，會很大程度上打擊其在搜索引擎上的排名。

以上是“JavaScript中平穩(wěn)退化graceful degradation的示例分析”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業(yè)資訊頻道！