Question

html是一段包含由AJAX请求产生的内联Javascript的HTML。以下代码：

$(html).filter('script')

为每个脚本标记返回一个jQuery对象，而：

$('script', $(html))

返回一个空数组。这怎么可能？我正在使用Chromium 10.0。

Answer 1

区别在于$（'script'，$（html））变为

$(html).find('script')

不是

$(htmls).filter('script');

我相信某种类型的脚本标签会在保持IE开心的幌子下从字符串中删除。一年前，我深入研究了jQuery源代码并找到了它所做的工作，但我不记得为什么会这样做。

Answer 2

好的在这里找到了一些东西，我想知道答案是否仍然相关或者不管怎么说创建一个新的JS文件，将其称为“scriptTagTest.js”，添加以下js代码

var html = '<div>I am DIV</div><script type="text/javascript">alert("I am inline");</script>';  
$(document).ready(function(e){  
  $('#inStr').text(html);  
});  

$('#test1').live('click', function(e){  
    var $html = $(html);  
  var o = $html.filter('script');  
  check(o);  
});  

$('#test2').live('click', function(e){  
    var $html = $(html);  
  var o = $('script', $html);  
  check(o);  
});  

function check($o, $html){  
  alert('obj len:'+ $o.length);  
    var $testArea = $('#testArea');  
  if($o.length > 0){  
    $testArea.append($o);  
  }  
  else{  
    $testArea.text('No script obj');  
  }  
}

然后将html文件改为

<!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <!--[if IE]>
      <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <script src="scriptTagTest.js"></script>
</head>
<body>
  <p id="hello">Hello World</p>
  <div id="inStr">test</div>
  <button id="test1">Test $(html).filter('script')</button>
  <button id="test2">Test $('script', $(html))</button>
  <div id="testArea">&nbsp;</div>
</body>
</html>

单击“Test1”和“Test2”查看结果。有趣的是，浏览器没有正确解析变量html和<script>标签，这是我之前没有遇到的，这就是为什么另一个JS文件。

find()用于查看子元素，filter()在平面对象列表中查找。如果传入的html是html变量的形式，那么这可能会解释一些事情在chrome 8（桌面），FF，IE最新版本中测试过。希望这可以帮助。最好是使用Firebug进行深入研究!!

jQuery选择器与过滤器意外结果

2 个答案: