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

2020/10/21 12:21 · javascript ·  · 0评论

我很难找到从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。

您可以使用以下方法访问原始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() 只是进入dom并获取元素的属性“值”,无论是否选中它。

本文地址:http://javascript.askforanswer.com/ruhecongjqueryxuanzeqihuoqudomyuansu.html
文章标签: ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!