본문 바로가기
jquery

$(this) 내 자신 태그까지 가져오기

by 자바초보자 2015. 10. 8.
728x90

 

http://stove99.tistory.com/139

 

 

예를들어 요런 HTML 이 있다 치면

1
2
3
4
5
6
7
<div id="sample">
    <div class="imgholder">
        <img src="/sample/img.png" />
    </div>
    <strong>Alone</strong>
    <div class="meta">by Zsolt Zsigmond</div>
</div>



$("#sample").html(); 로는 sample 안쪽의 html 만 가져올수 있다.

1
2
3
4
5
<div class="imgholder">
    <img src="/sample/img.png" />
</div>
<strong>Alone</strong>
<div class="meta">by Zsolt Zsigmond</div>


sample 까지 포함한 html을 가져오기 위한 jQuery 함수는 없는것 같다. 찾아보면 있을지도 -_-?


아무튼 sample 까지 포함한 outer HTML 을 가져오기 위해 outerHTML() function 을 추가해 보자

1
2
3
4
5
6
7
8
9
10
11
12
$.fn.outerHTML = function() {
    var el = $(this);
    if( !el[0] ) return "";
 
    if (el[0].outerHTML) {
        return el[0].outerHTML;
    } else {
        var content = el.wrap('<p/>').parent().html();
        el.unwrap();
        return content;
    }
}



사용법

1
2
3
console.log($("#sample").outerHTML());
// <div id="sample"><div class="imgholder"><img src="/sample/img.png" /></div>
// <strong>Alone</strong><div class="meta">by Zsolt Zsigmond</div></div>

 

 

 

 

728x90

'jquery' 카테고리의 다른 글

.wrap()  (0) 2015.12.02
현재 선택된 object의 tagname 변경  (0) 2015.11.24
jquery 라이브러리 동적 로딩  (0) 2015.11.16
jquery ajax 전송 시 array data  (0) 2015.10.21
jquery iframe 부모에 접근  (0) 2015.10.12