Jquery를 사용하여 특정 속성 (id)까지 횡단 HTML 요소

Question

Jquery 1.7.2를 사용 중입니다.

내 페이지의 모든 html 요소에 마우스를 올려서 에 Jquery를 사용하여 특정 특성 (id)까지 HTML 요소를 가로 지르고 싶습니다.

우리는 부모() 함수하지만 문제는 id 속성

$("*", document.body).click(function (e) { 
    e.stopPropagation(); 
    var domEl = $(this).get(0);  
     var parentEls = $(domEl).parents() 
     .map(function() { 
       return this.tagName; 
      }) 
     .get().join(", "); 

$ ("B")를 가지고있는 부모 요소에서 중지를 선택하는 방법이다가 추가 (""+ parentEls + "을."); }});

이 코드하지만 난 루트 까지 모든 요소를 ​​얻고있다하지만 난

저를 도와주세요 태그에 ID 속성이있는 옷장 요소를 중지합니다.

Answer 1

그냥 closest 사용

$(this).closest('[id]'); 

---

편집 : your'e 그냥 될 어떤 id 속성을 가지고 가장 가까운 하나 찾고하지 않는 한

$(this).closest('#the-id'); 

---

: 업데이트 된 질문을보고 나면 원하는 내용이어야합니다.

$(document).click(function(e) { 
    e.preventDefault(); 
    var parents = $(e.target).parentsUntil('[id]') 
     .map(function() { return this.tagName; }).get().join(','); 
    console.log(parents); 
}); 

을 사용하면을 선택하고 DOM의 모든 노드에 클릭 이벤트를 바인딩하지 않고도이 방법을 사용할 수 있다는 점에 유의하십시오. 이는 상당히 무거운 방법입니다.

---

편집 (다시) : 어쩌면 당신이 거기에 id 속성을 가진 태그를 포함하고 싶었처럼 보인다 (위의 솔루션은 최대하지만 태그를 포함하지 않음에 이르기까지이다). 이렇게하려면 솔루션은 꽤 비슷합니다.

Answer 2

계층 구조를 클릭 한 요소에서 문서 루트까지 매핑하려는 것처럼 보입니다. jmar777, 당신은 또한 당신의 선택을 변경해야합니다,

$(document).click(function(e) { 
    e.preventDefault(); 
    var parentEls = $(e.target).parents().map(function() { 
     return this.tagName; 
    }).get().join(", "); 
}); 

주 :이 경우, 당신은 parents()event.target를 적용 할 수 "*" 당신이 원하지 않는 것을 아마 에 이벤트 핸들러 모든 요소를 추가합니다 . 대신 단일 처리기를 document에 바인딩하여 이벤트 버블 링을 활용하십시오.