noscript 标签,一个被忽视的重要标签
打开 Drupal 的新后台,发现显示大面积空白
。本以为是 CSS 的问题,后来折腾好久才发现是我之前因为某些站的安全问题把浏览器的 Javascript 给禁用了。Javascript 的日益强大使我们的网页丰富多彩,交互越来越强大,功能越来越炫。但是有的网页效果完全依赖 Javascript 来实现,一旦离开了 Javascript 的支持,可能连基本的内容都显示不完全,这时候,我们老当益壮的noscript标签就该出场了
。
noscript标签是一个相当古老的标签,其被引入的最初目的是帮助老旧浏览器的平滑升级更替,因为早期的浏览器并不能支持 JavaScript。noscript 标签在不支持JavaScript 的浏览器中显示替代的内容。这个元素可以包含任何 HTML 元素。这个标签的用法也非常简单:
<noscript>
<p>本页面需要浏览器支持(启用)JavaScript</p>
</noscript>
不过到了现在,浏览器不支持 Javascript 的事情应该已经不会出现了,但是用户也可能因为各种原因而禁用了 Javascript。如节省流量,延长电池使用时间,或者是不希望自己的隐私被各类统计/追踪脚本泄露
。也有相当一部分用户安装了类似NoScript的浏览器扩展来禁止浏览器运行 Javascript。
网站虽然不能强制用户启用浏览器的 Javascript,但是可以提示用户的浏览器已经禁用脚本,来达到更好的用户体验。例如 Fackbook 这样的提示:

noscript 标签中的元素中的内容只有在下列情况下才会显示出来:
- 浏览器不支持脚本
- 浏览器支持脚本,但脚本被禁用
符合上述任何一个条件,浏览器都会显示 noscript 中的内容。而在除此之外的其他情况下,浏览器不会呈现 noscript 中的内容。
写在最后
使用 noscript 标签只能给网站用户传达一个信息,即如果不启用 Javascript,网页内容和效果可能不能完全被呈现。但如果有些用户并不懂得如何去开启 Javascript的话,这样的提示信息对他也并没有什么实际的帮助。所以我们还是应该在网站设计之初多多考虑在没有 Javascript(或 HTML5,或其他依赖)的支持的情况下,如何使这样的非常规状况尽可能少的影响到用户的浏览体验。
我的个人博客,里面会有各种有意思的东西哦,欢迎关注。iamkun.com
noscript 标签,一个被忽视的重要标签的更多相关文章
- 被忽视的META标签之特效
在web设计中使用js可以实现很多的页面特效,然而很多人却忽视了HTML标签中META标签的强大功效,其实meta标签也可以实现很多漂亮的页面过渡效果. META标签是HTML语言HEAD区的一个辅助 ...
- 被忽视的META标签之特效(页面过渡效果)
在web设计中使用js可以实现很多的页面特效,然而很多人却忽视了HTML标签中META标签的强大功效,其实meta标签也可以实现很多漂亮的页面过渡效果. META标签是HTML语言HEAD区的一个辅助 ...
- HTML之:fieldset——一个不常用的HTML标签
2016年4月14日17:10:02记录 一个不常用的HTML标签fieldset,不过我觉得比较有意思,其语法如下: <fieldset><legend>fieldset名称 ...
- 一个简单的jsp自定义标签
学到了一个简单的jsp自定义标签,后面有更多的例子,会更新出来: 例子1: 步骤: 1.编写标签实现类: 继承javax.servlet.jsp.tagext.SimpleTagSupport; 重写 ...
- 一个完整的html 每个标签的含义
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- HashTab---Windows资源管理器的文件属性窗口中添加了一个叫做”文件校验”的标签
HashTab 是一个优秀的 Windows 外壳扩展程序,它在 Windows 资源管理器的文件属性窗口中添加了一个叫做”文件校验”的标签.该标签可以帮助你方便地计算文件的 MD5.SHA1 与 C ...
- android一个倾斜的TextView,适用于标签效果
描述: android一个倾斜的TextView,适用于标签效果 应用截图: 使用说明: <com.haozhang.lib.SlantedTextView android:layout_wid ...
- 使用一个CSS Class去给标签定义Style
使用一个CSS Class去给标签定义Style 类是可重用的样式,可以添加到HTML元素. 下面是一个CSS类声明的例子: <style> .blue-text { colo ...
- Python+Selenium - 一个元素有两个标签时:一个用于显示,一个用于底层
如下图,这种一个元素由两个标签控制的,用js改值时需要两个标签的属性值都改 改值代码 js_code = 'a = document.getElementById("lostdate&quo ...
随机推荐
- endnote X7使用方法
网页版的endnote不能添加新模版,只能用模版库里的那些,所以转而试试离线版客户端. 1.下载安装完以后(下载地址就不给了,网上有很多),在word里可以看到顶栏有插件,如果你同时也安装了在线版本, ...
- CSS继承性和层叠性
一. 继承性 1. 含义:从自己开始直到所包裹的最小的元素,都可以继承一些特有的属性. 2. 作用范围: a. color.text-开头的.line-开头的.font-开头的,均可以继 ...
- Mysql密码忘记后如何重设密码
1. 首先检查mysql服务是否启动,若已启动则先将其停止服务 2. 打开第一个cmd窗口,切换到mysql的bin目录,运行命令: mysqld --defaults-file="C:\P ...
- doubango(1)--从协议栈结构说起
自顶向下与自底向上 软件设计的两种方法不过于自顶向下与自底向上. 对于自顶向下而言,先设计好用户接口,再往下延伸至各个功能块的具体实现.而对于自底向上而言,自然是有了设计好的各个功能代码块,再将这些功 ...
- Servlet 获取IllegelStateException
Servlet 获取IllegelStateException: response提交之后,进行requestDispatcher.forwar(),会产生这样的问题: 但是必须是outputStre ...
- ARC使用小结
内存管理基本原则 内存管理的依循下面的基本原则 自己生成的对象,那么既是其持有者 不是自己生成的对象,也可成为其持有者(一个对象可以被多个人持有) 如果不想持有对象的时候,必须释放其所有权 不能释放已 ...
- .Net多线程编程—误用点分析
1 共享变量问题 错误写法: 所有的任务可能会共享同一个变量,所以输出结果可能会一样. public static void Error() { ;i<;i++) { Task.Run(() = ...
- SQL 2005 安装数据库镜像教程
最近在搞在SQL 2005安装数据库镜像,中间遇到不少的错误,在此归纳总结,以方便有需要的朋友参考. 直接上脚本,主机部分: ---修改数据库为完整恢复模式USE master;ALTER DATAB ...
- css3 小图标提示特效
最近的计划,就是每天来几个特效,当然这里有限制,在什么候选区只能放一个,还每天有限制发布的,哎, 啊 终于写完了,看到一个挺好玩的东西,想到能不能用网页的特效做出来,试试呗!不过,一想肯东有很多的 相 ...
- php扩展SeasLog应用于 yii2 组件
一.seaslog 简单介绍及使用原因 它是C 写的PHP扩展,性能很高,使用简单,能满足大部分简单的日志需求.(个人感觉) 其他优势请看-->https://github.com/Neeke/ ...