jQuery 셀렉터에서 DOM 요소를 가져오는 방법은 무엇입니까?

jQuery 셀렉터에서 DOM 요소를 가져오는 방법은 무엇입니까?

나는 그들의 실제 정보를 알아내기 위해 불가능할 정도로 힘든 시간을 보내고 있습니다.DOMElementjQuery 선택기에서 선택합니다.

샘플 코드:

<input type="checkbox" id="bob" />
var checkbox = $("#bob").click(function() { //some code  } )

그리고 다른 코드에서 확인란의 선택된 값을 확인하려고 합니다.

  if ( checkbox.eq(0).SomeMethodToGetARealDomElement().checked )
    //do something.

그리고 제발, 나는 하고 싶지 않아요.

  if ( checkbox.eq(0).is(":checked"))
    //do something

그것은 나를 확인란에서 벗어나게 해주지만, 다른 때는 나는 진짜가 필요했습니다.DOMElement.

다음을 사용하여 원시 DOM 요소에 액세스할 수 있습니다.

$("table").get(0);

또는 더 간단하게:

$("table")[0];

하지만 (내 경험으로는) 이것이 실제로 필요한 것은 많지 않습니다.확인란 예를 들어 보겠습니다.

$(":checkbox").click(function() {
  if ($(this).is(":checked")) {
    // do stuff
  }
});

더 "jquery'ish"이고 (imho) 더 간결합니다.번호를 매기고 싶다면요?

$(":checkbox").each(function(i, elem) {
  $(elem).data("index", i);
});
$(":checkbox").click(function() {
  if ($(this).is(":checked") && $(this).data("index") == 0) {
    // do stuff
  }
});

이러한 기능 중 일부는 브라우저의 차이를 숨기는 데도 도움이 됩니다.일부 속성은 다를 수 있습니다.대표적인 예가 AJAX 호출입니다.원시 Javascript에서 이를 제대로 수행하려면 다음에 대한 폴백 사례가 약 7개 있습니다.XmlHttpRequest.

편집: 제가 당신이 요소를 얻을 수 없다고 생각한 것은 잘못된 것 같습니다.다른 사용자가 여기에 게시한 것처럼 다음과 같은 기능을 사용할 수 있습니다.

$('#element').get(0);

나는 이것이 실제로 일치된 DOM 요소를 반환한다는 것을 확인했습니다.

저는 그 요소를 끈으로 얻어야 했습니다.

jQuery("#bob").get(0).outerHTML;

이를 통해 다음과 같은 이점을 얻을 수 있습니다.

<input type="text" id="bob" value="hello world" />

...DOM 요소가 아닌 문자열로 표시됩니다.

DOM 요소와 직접적으로 상호 작용해야 한다면, 그냥 사용하는 것이 어떻습니까?document.getElementById클래스 이름이 하나의 요소에만 있거나 다른 옵션이 위험한 경향이 있다고 가정할 때 특정 요소와 상호 작용하려고 하면 ID를 알 수 있습니다.

그러나 대부분의 경우 jQuery가 제공하는 기능을 사용하여 필요한 작업을 수행하는 방법을 배워야 한다는 다른 의견에 동의하는 경향이 있습니다.

업데이트: 의견을 기반으로 합니다.여기 좋은 설명이 있는 게시물이 있습니다: http://www.mail-archive.com/jquery-en @googlegroups.com/msg04461.html

$(this).attr("checked") ? $(this).val() : 0

이 옵션을 선택하면 값이 반환되고 선택하지 않으면 0이 반환됩니다.

$(this).val()선택 여부와 상관없이 돔에 도달하여 요소의 "값" 속성을 얻는 것입니다.

언급URL : https://stackoverflow.com/questions/1677880/how-to-get-a-dom-element-from-a-jquery-selector