jQuery：value.attr不是函数

我在页面中偷了这个：

$('#category_sorting_form_save').click(function(){
    var elements = $("#category_sorting_elements > div");
    $.each(elements, function(key, value) {
        console.info(key," : ",value);
        console.info("cat_id: ",value.attr('cat_id'));
    });
});

当执行时，我得到：

0 : <div class="dragable" cat_id="6" value="" style="opacity: 1;">    
value.attr is not a function
    console.info("cat_id: ",value.attr('cat_id'));

我在这里做错了什么？我正在尝试获取div.cat_id元素的值。

该jQuery对象的内容是纯DOM元素，不会响应jQuery方法（例如.attr）。您需要通过将值$()转换为jQuery对象来使用它来包装它。

    console.info("cat_id: ", $(value).attr('cat_id'));

或直接使用DOM方法

    console.info("cat_id: ", value.getAttribute('cat_id'));

您正在处理原始DOM元素..需要将其包装在jquery对象中

console.info("cat_id: ",$(value).attr('cat_id'));

传递给each（）的回调函数的第二个参数将包含实际的DOM元素，而不是jQuery包装器对象。您可以调用元素的getAttribute（）方法：

$('#category_sorting_form_save').click(function() {
    var elements = $("#category_sorting_elements > div");
    $.each(elements, function(key, value) {
        console.info(key, ": ", value);
        console.info("cat_id: ", value.getAttribute('cat_id'));
    });
});

或者自己将元素包装在jQuery对象中：

$('#category_sorting_form_save').click(function() {
    var elements = $("#category_sorting_elements > div");
    $.each(elements, function(key, value) {
        console.info(key, ": ", value);
        console.info("cat_id: ", $(value).attr('cat_id'));
    });
});

或简单地使用$(this)：

$('#category_sorting_form_save').click(function() {
    var elements = $("#category_sorting_elements > div");
    $.each(elements, function() {
        console.info("cat_id: ", $(this).attr('cat_id'));
    });
});

您也可以使用jQuery('.class-name').attr("href")，就我而言，它效果更好。

此处的更多信息：“ jQuery（...）”而不是“ $（...）”