获取所有自定义 DOM 属性

Question

我正在动态地将DOM属性附加到元素上，如下所示：

i = 0;
document.body['a' + i] = "foo";
document.body['b' + i] = "bar";

有没有一种方法可以将我附加的所有属性作为数组获取？例如：

var allProperties = ['a0', 'b0'];

谢谢！

- Ood

---

你想要键还是值？我的意思是，你想让数组变成["foo","bar"]还是['a0','b0']？ - musicnothing

@MarkWalters 我不想使用全局数组。 - Ood

@AlexMorrise 如果我有键，我就可以调用值，所以只有键就足够了。 - Ood

Answer 1

您实际上可以创建一个新的body对象，并与该对象进行比较，以获取浏览器未添加的属性。

i = 0;
document.body['a' + i] = "foo";
document.body['b' + i] = "bar";

var el  = document.createElement('body'),
    arr = [];

for (var key in document.body) {
    if (document.body.hasOwnProperty(key) && !(key in el)) {
        arr.push(key);
    }
}

点此查看示例代码

让界面更加优美

var el  = document.createElement('body'),
    arr = Object.keys(document.body).filter(function(prop) {
        return !(prop in el);
    });

- adeneo

---

完美的答案！谢谢！ - Ood

不错！完全避免了需要保留单独的属性数组。同时，它将报告可能为初始主体设置的属性。 - samy

@samy - 它将返回所有不是由浏览器本身设置的属性，因此任何稍后添加的内容都将被返回。 - adeneo

Answer 2

在你感兴趣的元素中添加一个固定名称的属性，并推送自定义属性。

var pushInto = function(element, name, value)
{
    element[name] = value;
    if (element["customProperties"] == undefined)
    {
         element["customProperties"] = [];
    }
    element["customProperties"].push(name);
}

然后你可以这样做：

pushInto(document.body, "name", "value");
document.body["customProperties"]; // ["name"]

- samy