jQuery选择标记内部脚本标记

Question

我使用Backbone.js和模板是在脚本标记内。我有一个使用jQuery选择器迭代所有输入字段的插件。它没有获得脚本标签内的输入。

任何想法的如何从脚本标记内定义的html获取属性？

谢谢！

Answer 1

<script>就DOM而言，元素本质上是黑盒子，他们只是持有DOM不关心的数据（具体来说，它们持有non-replaceable character data，而不是标记）。因此，如果你做的是$('input')，你不会找到<script>元素中的<input>，因为<script>s内部没有任何<input>元素，只是包含字符序列'<', 'i', 'n', 'p', 'u', 't', ...的字符数据（即字符串）。

举例来说，如果你有这样的HTML：

<div></div> 
<script id="tmpl" type="text/x-underscore-template"> 
    <input name="{{name}}"> 
</script>​ 

那么这样的：

console.log('divs: ' + $('div').length); 
console.log('inputs: ' + $('input').length); 

会告诉你，有一个<div>和零<input> S和它说的都是实话。如果你需要看<script>里面，你就必须把字符数据转换成HTML手工的东西，如：

var $inputs_in_script = $($('#tmpl').html()).filter('input'); 

的$inputs_in_script的长度将是一个。

演示：http://jsfiddle.net/ambiguous/64kjq/

如果你使用一个模板引擎处理您<script>当时的你必须调用该模板引擎给你的HTML插件。然后插件会找到<input>，因为它们将是真实的<input>元素，而不是看起来像<input>元素的字符串。