jquery 选择器不适用于使用 Cassette 的脚本标记内的元素

Question

当尝试使用$("#index").data("onload")访问数据加载时，我得到'undefined'：

<script type="text/html">
        <section id="index" data-onload="app.load()">
            <div data-bind="text:name"></div>
        </section>
</script>

没有周围的脚本标签，一切正常。这是使用盒式磁带加载的，盒式磁带将其包装在脚本标签中。

我做错了什么？

Answer 1

脚本标记的内容不是文档的 DOM 树的一部分。 如果你考虑一下，这是有道理的，因为JavaScript语法不是有效的HTML，你可以把JavaScript塞进脚本标签之间。

通常，您不会在脚本标记中放置任何 HTML。 data-onload 属性中存在 JavaScript 不需要使用脚本标签，所以最简单的方法可能是擦除脚本标签。

另一方面，如果您尝试使用此 HTML 块作为模板，例如用于客户端 MVC 框架。 这是我唯一一次看到脚本类型="text/html"是有意义的。 在这种情况下，您需要在模板呈现到 DOM 后搜索 #index 部分。 在此之前，这个HTML实际上并不存在任何你可以用JQuery访问它的地方。

Answer 2

具有未知内容类型的脚本元素，它将被忽略。
浏览器不知道如何处理文本/html 类型脚本。

您只需要：

    <section id="index" data-onload="YourTextValue">
        <div data-bind="YourTextValue"></div>
    </section>

Answer 3

据我所知，<script> - Tag 中的代码通常编译为 Javascript，而不是 DOM 的一部分。而且我不确定<script type="text/html">是否是有效的标签/属性组合。

删除脚本标记，您不需要它。