javascript - 使用 appendchild 方法添加具有特定样式的元素

Question

这是我的代码：

(a=document).getElementsByTagName('body')[0].appendChild(a.createElement('div').style.cssText="someCssStyle");

它不起作用！但是当我只写这个时：

(a=document).getElementsByTagName('body')[0].appendChild(a.createElement('div'));

它有效，那么为什么我不能添加具有特定样式的 div 元素呢？我的工作有什么问题？我想从 chrome 上的 URL 植入中添加一个具有特定样式的 div 元素，使用：

javascript://all of my code goes here

所以一定要短。

score 1 · Accepted Answer

它不起作用的原因是这里：

...appendChild(a.createElement('div').style.cssText="someCssStyle")

您将字符串( "someCssStyle")传递给appendChild，而不是元素引用。JavaScript 中赋值的结果是右手边的值。

我不推荐它，但您可以使用逗号运算符来执行此操作：

(a=document).getElementsByTagName('body')[0].appendChild(d=a.createElement('div'),d.style.cssText="someCssStyle",d);

或者更合理的是，一个函数：

(function(){var a=document,d=document.createElement('div');d.style.cssText="someCssStyle";a.getElementsByTagName('body')[0].appendChild(d)})();

...除其他外，它不会成为THoIG的牺牲品。

score 1 · Accepted Answer

a.createElement('div').style.cssText="someCssStyle"

这将返回“someCssStyle”作为函数的参数(a=document).getElementsByTagName('body')[0].appendChild(。所以 div 永远不会被添加。你能看出这里的问题吗？

您必须创建 div，对其进行样式设置，然后将其添加到正文中。像这样

var div = document.createElement("div");
div.style.cssText = "someCssStyle";

document.body.appendChild(div);

2 回答 2