替换文件.getElementById与jquery函数

Replacing document.getElementById with jquery function?

本文关键字：jquery 函数 getElementById 文件 替换      更新时间：2023-09-26

我有这样的代码片段:

$('#selector1,#selector2').change(function(){
    checkDate(document.getElementById($(this).attr("id")));
});

上面的工作很好，但我想使用jQuery的$代替document.getElementById。所以，我尝试了这个，但它给了我一个javascript错误:TypeError: valueToTest is undefined 

$('#selector1,#selector2').change(function(){
    checkDate($("#" + $(this).attr("id")));
});

当您调用document.getElementById('id')时，您将获得对DOM节点本身的引用，而调用$('#id')将返回一个jQuery对象，该对象具有与选择器匹配的DOM节点的引用(如果有具有给定id的元素)。对于前者，您可以直接访问其属性(this.id, this.value等)，而对于后者，您需要使用jQuery函数(.prop(), .val()等)。

如果你想传递一个jQuery对象，你可能还需要修改你的checkDate函数，以避免直接访问属性的错误，而这些属性不再存在于jQuery对象上。

话虽如此，这一行:

checkDate(document.getElementById($(this).attr("id")));

比它需要的复杂得多。您已经获得了对元素this的引用，因此访问它的id并将其传递给document.getElementById()以获得对它的另一个引用是没有意义的。您可以简单地执行:

checkDate(this);

您正在传递一个jQuery对象作为参数checkDate()而不是DOM元素，要获得DOM元素，您可以这样做:

$('#selector1,#selector2').change(function(){
    checkDate(this);
});

您的代码片段:

document.getElementById($(this).attr("id"))
上面的代码返回一个HTML DOM Object。如果您使用$(this);，您将不会得到DOM Object，而是jQuery object。因此，您需要将其修改为$(this)[0]或this以获得DOM Object，这样您的代码就可以完美地工作了。

代码:

$('#selector1,#selector2').change(function(){
    checkDate($(this)[0]);
});

或

$('#selector1,#selector2').change(function(){
    checkDate(this);
});

文档。getElementById检索(一个)DOM节点，而jQuery返回一个jQuery对象，实际上是一个DOM节点数组。因此，要替换

var element = document.getElementById($(this).attr("id"));

使用jquery，这样做

var element = $($(this).attr("id"))[0];
// or
var element = $($(this).attr("id")).get(0);
相关文章：