1

我正在使用 JavaScript 阅读页面上的元素（各种），并在需要时对其进行修改。当我修改其中一个元素时，我想留下一个标记来说明我修改了它。然后，我可以阅读页面上的元素，如果找到那个标记，我知道它是我修改的元素之一，可以恢复它。这是对我有用的代码，但有人建议我应该使用 setAttribute 和 getAttribute 而不是我正在做的事情：

//hide some elements, after first leaving a marker and saving orig. val
for(var i=0; i<elements.length; i++) {
    if(should_i_hide_this_element(elements[i])) {    //external logic unimportant

        elements[i].wasModifiedByMe = true;             //mark element as modified
        elements[i].origViz = elements[i].style.visibility; //save visibility val
        elements[i].style.visibility = "hidden";          //and give it a new val
    }
}

对应的恢复元素值的代码是这样的：

for(var i=0; i<elements.length; i++) {
    if(elements[i].wasModifiedByMe) {                 //This is one I modified
        elements[i].style.visibility = elements[i].origViz; //restore original val
        elements[i].wasModifiedByMe = false;          //mark as not modified now
    }
}

问题是，我应该为我的 wasModifiedByMe 布尔值和我的 origViz 属性使用 setAttribute 和 getAttribute 吗？我目前不相信我需要为自己添加的属性使用属性函数。

在下面的线程讨论之后，我尝试了这个测试：

<!doctype html>
<html>
<body>
<div id="mydiv">DIV</div>
<script>
var elem = document.getElementById("mydiv");
elem.secretproperty = "not_seen_in_elements_tab_in_chrome_dev_tools";
elem.setAttribute("publicproperty","is_visible_in_elements_tab");
</script>
</body>
</html>

在 chrome 开发工具的元素选项卡中，我看到 mydiv 将 publicproperty 属性显示为 div 的一部分。虽然它没有显示秘密属性。

和我想的一样。使用 setAttribute 正在设置一个 HTML 属性，该属性也反映在 javascript 对象中，但是当不使用 setAttribute 并向 javascript 宿主对象添加属性时，反射不会以其他方式进行（到HTML 属性）。这就是我要的。我不希望我隐藏的每个元素都突然显示一个 wasHiddenByMe="true" 属性（尽管这有其优点，但我明白了）。

4

2 回答 2

2

There are some issues with setting your own properties of DOM elements, covered by this article on perfectionkills.com. It talks about extending DOM element prototypes, but the sections

are relevant to you. Yet, if your are aware of the issues I think it is OK - it is the only way to accociate custom objects to DOM elements.

If you can use HTML5 techniques, you also may have a look at data attributes. For simple boolean markers they may be the superior approach.

于 2012-05-31T13:08:34.383 回答
2

对于向 HTML 元素添加属性，W3C 标准是setAttribute. 您不能将其用于element.style。property.

但是，通过简单地设置属性element.* attribute* 仍然有效。这不是一个真正的标准，因此使用 可能会更好setAttribute，但这取决于您的喜好。

于 2012-05-31T12:50:53.543 回答