javascript - getAttribute() 返回空值？

Question

我不确定这里出了什么问题，但是当我尝试运行我的代码时，wishlist.getAttribute 返回 null，但如果我专门调用 getElementById，它将返回我需要的值。虽然我需要 wishlist.getAttribute 返回值，因为我正在为愿望 list 中的每个项目生成一个链接，但我需要它来保存产品 ID。

*注意我确实在多个链接的元素中使用类而不是 Id，尽管我在这里使用了 Id 来表明如果我专门调用元素 Id，它将返回 'data-wish' 属性值.

编辑

wishlist.getAttribute("data-wish"); 返回 null(错误)document.getElementById("remove_wishlist").getAttribute("data-wish");返回2(我需要的值)

while ($rst = $query->fetch_assoc()){

    //... display wishlist product and remove item link

    echo '<a href="#" onclick="removeWishlist(wishlist);" id="remove_wishlist" data-wish="<?php echo $id; ?>"><strong style='color:rgba(255,0,0,0.8);'>Remove Item</strong></a>';
}

JS

function removeWishlist(wishlist){

    var $x = wishlist.getAttribute("data-wish");   //returns null when the link is clicked

    var $y = document.getElementById("remove_wishlist").getAttribute("data-wish");  //returns "2" (product id) 

    $(document).ready(function(){

        //remove selected item and reload wishlist
        $.ajax({
            url: "php/panel.php",
            data: { wishlist_id_remove: $x },
            type: "post",
            dataType: "text",
            success: function(response) {
                alert(response);
            },

        });
    });
}

还要补充一点，写入心愿单项目和删除项目链接的 PHP 页面使用 Jquery.load() 加载到一个元素中，因此我可以在不刷新页面的情况下自动更新心愿单，也许这有助于我问题？

Answer 1

在添加到 CoursesWeb 的答案时，这一行

echo '<a href="#" onclick="removeWishlist(wishlist);" id="remove_wishlist" data-wish="<?php echo $id; ?>"><strong style='color:rgba(255,0,0,0.8);'>Remove Item</strong></a>';

是错误的，如果这段代码已经从 php 运行，它不会回显 data-wish attr 中的值 $id。它只会输出字符串文字。

那一行应该是:

echo '<a href="#" onclick="removeWishlist(this);" id="remove_wishlist" data-wish="'.$id.'"><strong style='color:rgba(255,0,0,0.8);'>Remove Item</strong></a>';`