Cara mendapatkan Elemen DOM dari Pemilih JQuery

Saya mengalami kesulitan menemukan untuk mendapatkan DOMElement sebenarnya dari pemilih jquery. Kode sampel:

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

dan di bagian kode lain saya mencoba menentukan nilai yang dicentang dari kotak centang.

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

Dan tolong, saya tidak ingin melakukan:

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

Itu membuat saya berkeliling kotak centang, tapi di lain waktu saya membutuhkan DOMElement nyata.

Anda dapat mengakses elemen DOM mentah dengan:

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

atau lebih sederhana:

$("table")[0];

Sebenarnya tidak banyak yang Anda butuhkan untuk ini (dalam pengalaman saya). Ambil contoh kotak centang Anda:

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

lebih "jquery'ish" dan (imho) lebih ringkas. Bagaimana jika Anda ingin memberi nomor pada mereka?

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

Beberapa fitur ini juga membantu menutupi perbedaan di browser juga. Beberapa atribut dapat berbeda. Contoh klasiknya adalah panggilan AJAX. Untuk melakukan ini dengan benar dalam Javascript mentah memiliki sekitar 7 kasus fallback untuk XmlHttpRequest.

Sunting: sepertinya saya salah dengan menganggap Anda tidak bisa mendapatkan elemen. Seperti yang orang lain posting di sini, Anda bisa mendapatkannya dengan:

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

Saya telah memverifikasi ini benar-benar mengembalikan elemen DOM yang cocok.

Saya perlu mendapatkan elemen sebagai string.

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

Yang akan memberi Anda sesuatu seperti:

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

... sebagai string daripada elemen DOM.

Jika Anda perlu berinteraksi langsung dengan elemen DOM, mengapa tidak menggunakan saja document.getElementByIdsejak itu, jika Anda mencoba berinteraksi dengan elemen tertentu, Anda mungkin akan tahu id, dengan asumsi bahwa nama kelas hanya pada satu elemen atau beberapa opsi lain cenderung menjadi berisiko.

Tapi, saya cenderung setuju dengan yang lain, bahwa dalam kebanyakan kasus Anda harus belajar untuk melakukan apa yang Anda butuhkan menggunakan apa yang jQuery berikan kepada Anda, karena sangat fleksibel.

UPDATE: Berdasarkan pada komentar: Berikut adalah posting dengan penjelasan yang bagus: http://www.mail-archive.com/[email protected]/msg04461.html

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

Ini akan mengembalikan nilai jika dicentang, atau 0 jika tidak.

$(this).val() baru saja mencapai dom dan mendapatkan atribut "nilai" elemen, apakah itu diperiksa atau tidak.