我们可以在<script type =“text / template”id =“template”> <script> </script>内的任何div上添加属性（即id / class）

Question

我想在#new-post上添加类属性，该属性是<script type="text/template" id="template"></script>

的内容

下面是我的代码，它能够找到“模板”的内容，但无法添加类属性。

$('#template').contents().find('#new-post').addClass('hello');

HTML

<script type="text/template" id="template">
   <div id="new-post">
   &nbsp;
   </div>
</script>

Answer 1

一个脚本元素包含CDATA，它不能包含子元素（<并不意味着“标记的开头”（除非该标记为</script>））。

如果要对模板内容执行DOM操作，则必须先将模板解析为DOM。

var template = $('#template').text(); 
var $template = $(template);
$template.addClass('hello');
alert($template.wrap('<div></div>').parent().html());

Answer 2

为什么不将模板渲染到dom然后添加类。

修改 请注意，即使div位于普通的html标记内，您的代码也不起作用。

请参考这个小提琴： http://jsfiddle.net/shyamchandranmec/R7g3S/

$('#foo').contents().find('#bar').addClass('fb');
$("#foo").find("#bar").addClass('foobar');

<div id="foo">
    <div id="bar">foo bar</div>
</div>

类fb不会添加到div #bar。