Jak získat prvek DOM z selektoru jQuery?

Mám nemožně těžké zjistit, jak získat skutečný DOMElement z selektoru jQuery.

Ukázkový kód:

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

a v dalším kusu kódu se snažím určit zaškrtnutou hodnotu zaškrtávacího políčka.

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

A prosím, nechci:

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

To mě dostane kolem zaškrtávacího políčka, ale jindy jsem potřeboval skutečný DOMElement .

Odpověď

K surovému prvku DOM můžete přistupovat pomocí:

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

nebo jednodušeji:

$("table")[0];

Ve skutečnosti toho však moc nepotřebujete (podle mých zkušeností). Vezměte si příklad zaškrtávacího políčka:

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

je více „jquery’ish“ a (imho) výstižnější. Co kdybyste je chtěli očíslovat?

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

Některé z těchto funkcí také pomáhají maskovat rozdíly v prohlížečích. Některé atributy se mohou lišit. Klasickým příkladem jsou volání AJAX. Chcete-li to udělat správně v surovém Javascriptu, má asi 7 záložních případů pro XmlHttpRequest .