Javascript平稳退化、渐进增强

平稳退化：

　　javascript平稳退化就是如果一个浏览器完全不支持js或者禁用js的时候，它的基本功能不会受到任何影响。比方说一个网站使用了大量javascript来优化页面，我们现在把浏览器的javascript给禁用掉，这个网站的显示效果会变得比较糟，但是基本功能不会受到影响：登录页面可以正常登录，表单可以正常提交等。

　　一些网站如果禁用js，它的基本功能就会受到严重影响，比方说某个链接打不开，表单无法提交等，这些都是不能实现平稳退化的。

　　如，就像表单提交，通常可以用<input type="submit">来实现提交功能，也可以使用Jquery的AJAX提交来实现：　　

$.ajax({

　　type:"get",

　　url:"url",

　　async:true,
　　success:function(){
　　　　alert("ajax提交");
　　}

});

　　这样子也可以实现表单提交，但是如果浏览器的js被禁用了，这个就无效了。如果非要在一些场合使用ajax提交方法又要兼顾js的平稳退化，对于它的处理方法是预先在form中定义好一个submit按钮：　

<form id="form" method="post" action="url">

　　<input type="submit" id="sub">

</form>

　　JS代码中默认设定submit不可见

<script>

    window.onload = function () {

    　　document.getElementById("sub").setAttribute("style","display:none")

    }

</script>

　　这样一旦js被禁用，对submit的隐藏就会失效，显示出来的submit按钮可以继续完成表单提交的功能。

　　如链接打开事件：

<a href="#" id="openNewUrl">例子</a>

<script>

    $("openNewUrl").on("click",function(){

    　　window.open('http://baidu.com',"新的窗口名字","新的窗口属性（窗口尺寸、工具条、菜单条、初始显示位置等）");

    　　return false;　　//阻止默认事件

    }

</script>

　　把 href 属性的值设为 “#” 只是为了创建一个空链接。实际工作全部由onclick负责完成。这种做法也不行，一旦用户禁用了浏览器的JavaScript功能，这样的链接将毫无用处。

　　兼顾js平稳退化。

<a href="http://baidu.com" id="openNewUrl">例子</a>

渐进增强：

　　在客户的浏览器支持JavaScript功能的前提下，我们才考虑“渐进增强”。浏览器有不同的版本，高级版本支持的JavaScript功能就多一些，低级版本浏览器支持的JavaScript功能就少一些。所以就算浏览器支持JavaScript功能，我们也要区别对待不同版本的浏览器。例如：如果你用JavaScript5的对象和方法来编写程序，那么Firefox，Safari，Chrome，IE等低级版本，可能就不能使用你的程序。所以你解决这个问题的方式就叫“渐进增强”，基本上就是一些判断语句------如果这个浏览器不存在这个对象或者方法，则程序退出。

即：
“平稳退化”是在浏览器没有JavaScript功能，或没有开启JavaScript功能情况下，我们解决这种问题的方式；
“渐进增强”是在浏览器开启JavaScript功能后，如果浏览器版本不支持某些JavaScript能力，我们解决这种问题的方式。

巴特西

Javascript平稳退化、渐进增强

平稳退化：

渐进增强：

最新文章

热门文章

巴特西

Javascript平稳退化、渐进增强

平稳退化 ：

渐进增强：

最新文章

热门文章

平稳退化：