2010-12-30 3 views
1

html은 AJAX 요청으로 인한 인라인 자바 스크립트가 포함 된 HTML 조각입니다. 다음 코드 :jQuery 선택기 대 필터 예기치 않은 결과

$('script', $(html)) 

가 발생하면 빈 배열을 반환합니다 :

$(html).filter('script') 

는 반면, 각 스크립트 태그에 대한 jQuery를 개체를 반환합니다. 이것이 어떻게 가능한지? Chromium 10.0을 사용하고 있습니다.

+3

$ ('script', $ (html))'$ (html) 노드가 원하는

0

여기에 뭔가가 있습니다. 답이 여전히 관련성이 있거나 그렇지 않더라도 궁금합니다. 새로운 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'); 
    } 
} 

<!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을"으로 다음 HTML 파일 및 "Test2를"을 추가로 말한다 결과. 흥미롭게도 브라우저는 이라는 변수를 <script> 태그로 올바르게 구문 분석하지 못했습니다. 그 이유는 다른 JS 파일이 그 이유입니다.

find()은 자식 요소를 조사하는 데 사용되고 filter()은 개체의 평면 목록에서도 찾습니다. 들어오는 html이 html 변수의 형식이면 뭔가 설명 할 수 있습니다.
크롬 8 (데스크톱), FF, IE 최신 버전에서이를 테스트했습니다. 희망이 도움이됩니다. Firebug를 사용하여 드릴 다운하는 것이 가장 좋습니다!

관련 문제