本节书摘来自异步社区《jQuery、jQuery UI及jQuery Mobile技巧与示例》一书中的第3章,第3.2节,作者:【荷】Adriaan de Jonge , 【美】Phil Dutson著,更多章节内容可以访问云栖社区“异步社区”公众号查看
3.2 示例:移除类
removeClass()函数的工作方式与addClass()相同。一个常见的使用示例是隐藏只有当JavaScript可用的时候才会使用的HTML元素。代码清单3-2演示了如何在文档刚加载完时移除no-js类。
代码清单3-2 在JavaScript不可用时隐藏HTML内容
00 <!DOCTYPE html>
01
02 <html lang="en">
03 <head>
04 <title>The removeClass() function</title>
05 <style>
06 .no-js {
07 display: none;
08 }
09 </style>
10 </head>
11 <body>
12
13 <p>This page contains both text that is always
14 available and text that is only visible when
15 JavaScript is available</p>
16
17 <p class="no-js">This could be a part of the site that
18 is JavaScript dependent and is better hidden when
19 JavaScript is unavailable.</p>
20
21 <script src="http://code.jquery.com/jquery-latest.min.js"></script>
22
23 <script>
24 // 请将下列代码移至一个外部的.js文件中
25 $(document).ready(function() {
26
27 $('.no-js').removeClass('no-js');
28
29 // removeClass()也可以没有参数;
30 // 但这会把元素上别的类也移除
31 //
32 // $('.no-js').removeClass();
33
34 });
35 </script>
36 </body>
37 </html>
还有另外一种方法,可以使用noscript元素,它的内容只会在JavaScript不可用时显示。