는 jQuery를 찾아() 문제

Question

나는 다음과 같은 코드

var page = '<h1>Hello!</h1><p>FOO</p><span class="username">this is ur name</span><p>sample text</p>'; 

내가 안녕을 얻을 $(page).html() 경고

에게있다! 그리고 내가 div의 페이지 내용을 감쌀 때 $(page).html() 나는 전체 HTML 내용을 얻는다.

내가 여기에서 달성하려고하는 것은 HTML 템플릿이있는 페이지 문자열이 있고 클래스가 username 인 것을 찾고 있는데 null입니다. 나는이와 혼란 스러워요

여기

문제의 작은 바이올린입니다 발생

http://jsfiddle.net/6TSuq/1/

Answer 1

당신이 4 개 요소를 포함하는의 jQuery 객체를 생성 $(page) 전화; 문자열에 중첩되지 않은 HTMLElements 각각에 대해

console.log($(page).map(function() { 
    return this.nodeName; 
}).toArray()); 

// ["H1", "P", "SPAN", "P"] 

html() 반환이 jQuery를 개체에 제 소자의 innerHTML에게; 그래서 "Hello!"만 볼 수 있습니다.

.username을 찾으려면 filter() 메서드를 사용해야합니다.이 메서드는 jQuery 개체 내에서 지정된 선택기와 일치하는 요소를 검색합니다.

alert($(page).filter('.username').text()); // "this is ur name", kthx. 

업데이트 된 바이올린을 여기에서 확인하십시오. http://jsfiddle.net/6TSuq/15/

미래에는 다음과 같은 중첩 요소가있을 수 있습니다. 결과가 yeild 것 .username 위해 보내고이 상황에서

var page = "<h1><span class='username'>Foo</span></h1>"; 

, filter(); jQuery 객체 $(page)에는 .username 요소가 포함되어 있지 않으므로 h1을 포함하며, 자손은 .username입니다. 그러므로 여기서 당신은 사용할 필요가 있습니다; 참고로

alert($(page).find('.username').text()); 

는이 작업을 수행하는 find(), filter() 및 map()

Answer 2

아주 간단한 방법을 볼 수 있습니다 :

var elem = $('<h1>Hello!</h1><p>FOO</p><span class="username">this is ur name</span><p>sample text</p>').filter('.username').get(0); 
console.log($(elem).html()); // returns this is ur name 

​jsFiddle example

은 당신이 당신의 문자열을 변환해야 모든 jQuery를 사용하기 위해 먼저 jQuery 객체 그것에 대한 방법.