Jak uzyskać Element DOM z selektora JQuery

Mam niemożliwie trudny czas, aby dowiedzieć się, aby uzyskać rzeczywisty DOMElement z selektora jquery. Przykładowy Kod:

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

I w innym fragmencie kodu próbuję określić sprawdzoną wartość checkboxa.

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

I proszę, nie chcę robić:

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

To mnie wokół pola wyboru, ale innym razem potrzebowałem prawdziwego DOMElement.

Author: Sotomajor, 2009-11-05

4 answers

Możesz uzyskać dostęp do surowego elementu DOM za pomocą:

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

Lub prościej:

$("table")[0];

Nie ma tak naprawdę wiele potrzebujesz tego dla jednak (z mojego doświadczenia). Weźmy przykład checkboxa:

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

Jest bardziej "jquery" i (imho) bardziej zwięzły. A gdybyś chciał je policzyć?

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

Niektóre z tych funkcji pomagają również maskować różnice w przeglądarkach. Niektóre atrybuty mogą być różne. Klasycznym przykładem są wywołania AJAX. Aby to zrobić poprawnie w surowym Javascript ma około 7 przypadków awaryjnych dla XmlHttpRequest.

 246
Author: cletus,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-07-17 09:16:43

Edit: wydaje się, że myliłem się zakładając, że nie możesz dostać elementu. Jak inni tu pisali, można go dostać za pomocą:

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

Sprawdziłam, czy rzeczywiście zwraca element DOM, który został dopasowany.

 7
Author: eduncan911,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-11-05 02:46:11

Musiałem uzyskać element jako ciąg znaków.

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

Co da ci coś w stylu:

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

... jako ciąg znaków, a nie element DOM.

 6
Author: Chad Hedgcock,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-02-25 21:36:49

Jeśli Chcesz wejść w interakcję bezpośrednio z elementem DOM, dlaczego nie użyć document.getElementById ponieważ, jeśli próbujesz wejść w interakcję z określonym elementem, prawdopodobnie będziesz znał id, ponieważ założenie, że nazwa klasy jest tylko na jednym elemencie lub innej opcji jest ryzykowne.

Ale zazwyczaj zgadzam się z innymi, że w większości przypadków powinieneś nauczyć się robić to, czego potrzebujesz, używając tego, co daje Ci jQuery, ponieważ jest bardzo elastyczny.

Aktualizacja: na podstawie komentarza: Oto post z ładne Wyjaśnienie: http://www.mail-archive.com/[email protected]/msg04461.html

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

Zwróci wartość, jeśli jest zaznaczona, lub 0, jeśli nie jest.

$(this).val() jest tylko dotarcie do dom i uzyskanie atrybutu "wartość" elementu, niezależnie od tego, czy jest zaznaczony.

 1
Author: James Black,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-11-05 02:22:48