[对象节点列表]是什么意思?

What does it mean by [Object Nodelist]?

我正在开发一个待办事项简单 html 网页,我在那里添加了一个按钮,用于选择该网页上所有添加的任务并将其添加到用户的 cookies,

document.getElementById("save-all-btn").addEventListener("click", function(e) {
    let elements = document.querySelectorAll("li");

    setCookie("taskList", elements, 30);
    let Value = getCookie("taskList");
    console.log(Value);
});

就像上面的代码一样,我有一个事件监听器,它在我的按钮点击时运行一个函数,然后这个函数选择我网页上的所有“Li”,然后我有一个函数,我只是简单地用来设置cookie 名称、值及其到期,之后我有一个变量,其中存储了一个名为 getCookie 的函数的 return 值,该函数只是通过 cookie 名称

读取用户 cookie

但是当我在 returned 值上使用 console.log 时,它显示 [object NodeList]

我很困惑它是什么,有什么方法可以将节点列表保存在 cookie 中,然后将其作为节点列表加载回来并将其附加到我的 HTML 文件

我的 setCookiegetCookie 函数如下所示:

function setCookie(cname, cvalue, exdays) {
    const d = new Date();
    d.setTime(d.getTime() + (exdays*24*60*60*1000));
    let expires = "expires=" + d.toGMTString();
    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

function getCookie(cname) {
    let name = cname + "=";
    let decodedCookie = decodeURIComponent(document.cookie);
    let ca = decodedCookie.split(';');
    for(let i = 0; i < ca.length; i++) {
        let c = ca[i];
        while (c.charAt(0) == ' ') {
            c = c.substring(1);
        }
        if (c.indexOf(name) == 0) {
            return c.substring(name.length, c.length);
        }
    }
    return "";
}

这段代码我从Here

这里有一段解释 Array 和 NodeList 之间区别的摘录:

NodeLists and Arrays are two different things because NodeLists are actually not a JavaScript API, but a browser API.

Things like querySelectorAll() and getElementsByTagName() aren’t JavaScript methods, they’re browser APIs that let you access DOM elements. You can then manipulate them with JavaScript.

(source)

话虽如此,节点列表和数组之间没有一对一的转换,结果数组将包含它在浏览器上下文中的所有属性和方法API.

您可以查询节点,并以文本格式(如json)保存它们的一些重要属性,例如它们的维度、数据等。您将必须重新阅读本文并通过 DOM 方法自行创建节点列表。