javascript - 使用 Javascript 的 setAttribute() 背后的原因是什么?

标签 javascript css

<分区>

如果我单独设置我的属性,它们之后都是正确的:

document.getElementById("FlightPanels").style.height = (PANEL_HEIGHT + 20) + "px";
document.getElementById("FlightPanels").style.width = container_width + "px";

即使我先设置宽度,然后设置高度,它们都是正确的。

但是,如果我使用 setAttribute():

document.getElementById("FlightPanels").setAttribute("style", "height:" + (PANEL_HEIGHT + 00) + "px");
document.getElementById("FlightPanels").setAttribute("style", "width:" + container_width + "px");

如果我先设置高度,宽度就会丢失。如果我先设置宽度,高度就会丢失。

我见过使用 setAttribute() 在单个调用中设置所有所需属性的解决方案,传递具有多个要设置的属性的 javascript 对象。

在我看来,这比直接单独设置属性要复杂得多,可读性也差得多。

如果我要设置大量属性,我发现单独设置方法更容易阅读和理解。

我的问题是,是否有一些令人信服的理由(我可能没有意识到)使 setAttribute() 成为首选解决方案? 出于某些原则性或“最佳实践”的原因,我应该使用 setAttribute() 吗?还是可以单独设置属性,如上所示?

我希望代码不仅可以工作,而且还符合标准。

编辑: 伙计们,感谢您的输入,但我的部分问题与为什么对 setAttribute() 的两次后续调用相互撤消有关。是因为我以某种方式滥用它吗?或者这是功能的预期设计?在这方面,它不是任何东西的重复,因为标记的重复问题没有解决这个问题。但是您的意见很有帮助。谢谢。

最佳答案

setAttribute 是用于设置任何 HTML 属性的通用函数。

您很少会想要修改属性值的部分

style 属性表示一个完整的 CSS 规则集,您通常需要修改其中的特定部分。

setAttribute 通常对设置 style 没有用。

Thanks for the input, folks, but part of my question has to do with why do two subsequent calls to setAttribute() undo each other.

第一次调用将属性设置为某物。

第二个将它设置为其他东西。

设置。不追加。它用新值替换旧值。

关于javascript - 使用 Javascript 的 setAttribute() 背后的原因是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50045636/

上一篇:javascript - 如果元素有类什么都不做运行匿名函数

下一篇:html - 相同长度字符的像素差异

相关文章:

php - 访问图像数组中的单个元素

javascript - $.ajax() 成功不会运行函数

javascript - 使用正则表达式匹配字符串中的 pos 或 neg 两个数字

javascript - $(window).focus() 在 Chrome 中未正确执行

html - col-xl-* 的静态宽度(Bootstrap 4)?

html - [Bootstrap ]"Responsive"iframe 被裁剪或太大

javascript - nuxeo 通过 API 检查目录是否存在

javascript - Bowerrc 安装后 Hook 不起作用

html - 在 Bootstrap 4 面包屑中右对齐文本

javascript - 如何在 chrome 扩展弹出窗口上创建 "tail"