如何从JQuery选择器获取DOM元素

Question

我很难找到从jquery选择器中获取实际DOMElement的时间。样例代码：

<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。

Answer 1

您可以使用以下方法访问原始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。