为你的网站添加上JavaScript禁用提示页面吧

开发 前端
本文主要介绍的是,网站禁用JavaScript脚本的程序,作者从淘宝说起,让我们一起来看。

淘宝曾做出调查,大约有0.1%的淘宝用户在访问淘宝网的时候是警用js脚本的,虽然看似比例不大,但假设淘宝网每天有1000万人访问,那也有1万人是无法正常浏览淘宝网的,一个大型的网站是绝对不允许出现这样的问题的,所以淘宝在这块做的很好,怎么个好?让我们用IE8来测试下(当然前提是在Internet选项里把js脚本都禁用起)

然后访问,我们发现出现了一个提示页面,提示用户是否继续访问,或者进入另外一个页面查看解决办法。

有了这么一个页面,是否觉得操作上更加友好了?那这功能要如何实现呢,其实代码相当简单:

  1. <!--[if lte IE 8]>  
  2. <noscript>  
  3. <style>  
  4. //当脚本警用时,将网页上不需要显示的模块都进行隐藏  
  5. .html5-wrappers{display:none!important;}  
  6. </style>  
  7. <div class="ie-noscript-warning">  
  8. 您的浏览器禁用了脚本,请<a href="">查看这里</a>  
  9. 来启用脚本!或者<a href="/?noscript=1">继续访问</a>.  
  10. </div>  
  11. </noscript>  
  12. <![endif]-->  

  上面这段代码是淘宝主页上直接复制来,但其中继续访问的链接里加了句“?noscript=1”,在淘宝上测试后,点击继续访问会显示正常主页(js脚本禁用下的主页),但我在本地测试却不行,可能noscript=1是给后端语言用做判断的,比如:

  1. <?php  
  2. if(!$_GET['noscript']){  
  3. ?>  
  4. <!--[if lte IE 8]>  
  5. <noscript>  
  6. <style>  
  7. //当脚本警用时,将网页上不需要显示的模块都进行隐藏  
  8. .html5-wrappers{display:none!important;}  
  9. </style>  
  10. <div class="ie-noscript-warning">  
  11. 您的浏览器禁用了脚本,请<a href="">查看这里</a>  
  12. 来启用脚本!或者<a href="/?noscript=1">继续访问</a>.  
  13. </div>  
  14. </noscript>  
  15. <![endif]-->  
  16. <?php  
  17. }  
  18. ?>  

  哈哈,这只是我用php做了个假设,如果我没记错,淘宝也是用php做的,noscript=1很有可能就是这样操作的,当然代码肯定不会这样直接卸载页面里。

  总的来说,有一个js脚本禁用的提示对用户操作、交互都是很有帮助的,建议大家以后再开发网站时,可以考虑到这一点。淘宝为什么会成功,就是因为这些很小的细节。

【编辑推荐】

  1. JavaScript变量作用域之我见
  2. 高性能WEB开发之如何加载JavaScript
  3. 开发者最容易犯的13个JavaScript错误
  4. Javascript解决浏览器兼容性问题
责任编辑:于铁 来源: 博客园
相关推荐

2016-11-22 16:34:11

githubgit前端

2014-03-04 09:55:26

密码用户体验

2009-12-03 08:57:18

Windows 7圣诞主题

2013-09-09 16:37:48

iOS应用添加内置收费In App Purc

2020-12-20 19:26:20

LVMFedoraLinux

2012-04-28 15:05:57

增加App评分点评代码

2021-01-15 15:51:33

JavaScript开发技术

2012-07-09 09:43:59

ibmdw

2012-03-12 09:33:04

JavaScript

2016-11-17 07:35:04

网站优化

2018-04-04 08:47:42

移动应用AWS云质量保证

2009-12-02 20:09:45

PHP页面跳转函数

2020-01-17 18:40:38

Python游戏代码

2011-06-13 16:01:25

网站排名301跳转

2020-06-19 13:53:47

BokehPython绘图

2011-04-21 11:07:58

jQuery

2020-10-22 10:04:19

微软浏览器 IE

2022-08-01 08:36:09

upstream下游上游

2013-09-29 10:41:28

JavascriptJSFirefox 23

2015-12-25 16:30:21

JavaScript代码圣诞树
点赞
收藏

51CTO技术栈公众号