ID로 가장 가까운 요소 가져오기

StackOverflow https://stackoverflow.com/questions/53256

  •  09-06-2019
  •  | 
  •  

문제

두 가지 요소가 있습니다.

<input a>
<input b onclick="...">

b를 클릭하면 a에 액세스하여 일부 데이터를 조작하고 싶습니다.A에는 전역적으로 고유한 이름이 없으므로 document.getElementsByName이 종료되었습니다.이벤트 객체를 살펴보면 event.target.parentNode에 getElementsByName과 같은 기능이 있을 것이라고 생각했는데 <td>에는 그렇지 않은 것 같습니다.이를 수행하는 간단한 방법이 있습니까?

도움이 되었습니까?

해결책

만약에 a 그리고 b 서로 옆에 있고 동일한 상위가 있는 경우 다음을 사용할 수 있습니다. prevSibling 의 자산 b 찾다 a.

다른 팁

  1. 클릭한 요소를 찾을 수 있어야 합니다. 이벤트 객체.브라우저에 따라 원할 수도 있습니다. e.target 또는 e.srcElement.아래 코드는 이것에서 따온 것입니다. w3schools 예:

    function whichElement(e) {
  var targ;
  if (!e) var e = window.event;
  if (e.target) {
    targ=e.target;
  } else if (e.srcElement) {
    targ = e.srcElement;
  }

  if (targ.nodeType==3) { // defeat Safari bug 
    targ = targ.parentNode;
  }

  var tname;
  tname = targ.tagName;
  alert("You clicked on a " + tname + " element.");
}

  2. 그런 다음 다음을 사용할 수 있습니다. nextSibling 그리고 prevSibling DOM 순회 기능. 여기에 더 많은 정보가 있습니다.그리고 다시 한 번 w3schools 참조 XML DOM 노드.

원기 또한 DOM에서 이동할 수 있는 멋진 기능도 있습니다.귀하의 예에서는 다음과 같은 내용이 트릭을 수행합니다.

b.up().down('a')

해당 수준에 요소가 두 개 이상 있는 경우 CSS 선택기를 사용하여 원하는 요소를 정확하게 지정할 수 있습니다.

평범한 바닐라 JavaScript를 남겨두세요.JQuery를 사용하면 많은 시간을 절약할 수 있습니다.

http://docs.jquery.com/Selectors

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top