将类放在脚本标记上是否有好处?

Mat*_*iby 15 html javascript css

我遇到了这段代码

<script class="example" type="text/javascript">
Run Code Online (Sandbox Code Playgroud)

如果将这些内容写入代码是有好处的,那我很好奇

Mat*_*eer 8

我刚用这个标记进行了快速测试:

<!DOCTYPE html>
<html>
<head>
    <style>
        .foo {
            display: block;
            border: 2px solid red;
            width: 10px;
            height: 10px;
        }
    </style>
</head>
<body>
    <script class="foo" type="text/javascript">
        alert("can you see me?");
    </script>
    after the script  
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

结果是屏幕上出现红色块,并且在Chrome中运行时脚本标记的内容可见.IE根本不会显示脚本内容.所以<script>可以像任何其他标签一样对待,至少在Chrome中.我认为这是对Chrome的疏忽.这是32位Windows 7上的Chrome 10.0.648.204.

渲染上面的html的效果

编辑:Firefox 4也呈现相同的东西.

EDIT2:可能的用例?使用它作为页面上脚本的"显示源",向人们展示它是如何工作的,也许是在关于JavaScript的博客上?

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
</head>
<body>
    <script class="foo" type="text/javascript">
        function foobar() {
            var a = 1;
        }   
    </script>
    after the script
    <a href="#">show me the script</a>

    <script type="text/javascript">
        $('a').click(function(event) {
            event.preventDefault();
            $("<div>").html($(".foo").text()).appendTo($("body"));
        });
    </script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

  • 我认为这是一个bug .o0 (4认同)

Par*_*ker 7

视觉样式可能不是一个很好的例子.可以使用的地方是从许多脚本片段中动态选择一个以在其他地方使用,例如使用javascript模板语言.

Contrived Handlebars示例:

<script class="greeting english" type="text/x-handlebars-template">
    <p>Hello {{name}}</p>
</script>
<script class="greeting spanish" type="text/x-handlebars-template">
    <p>Hola {{name}}</p>
</script>

...

var greeting_template = Handlebars.compile($('script.greeting.' + language).html()); 
$('#header').append(greeting_template(user));
Run Code Online (Sandbox Code Playgroud)


小智 5

根据 w3c 标准,正如w3schools.com所描述的,脚本标签确实支持全局属性,其中之一是“class”属性。因此,拥有具有特定类属性的脚本标签是完全“合法的”,而破坏这一点的浏览器则不完全符合 w3c。script 标签还支持全局属性“id”。

至于使用带有“class”或“id”的脚本标签的可能实用性,需要有一个非常具体的用例,在将其发送给客户端浏览器渲染之前,遍历 w3c 文档或 DOM 抽象是处理。在这种情况下,可以使用 css 样式选择来完成对文档进行更改的方法,并且出于多种不同的原因,使用“id”和“class”对脚本进行分组可能很有用。

这是一个狭隘而具体的案例,但此时此刻我确实参与其中。说它没有用处是狭隘的,说它按照标准是非法的也是错误的。它可能不受所有浏览器的支持,但浏览器(甚至是现代浏览器)以不同方式解释 w3c 标准并以自己的方式实现其标准支持版本的情况并不罕见。