Question

我通过Javascript创建一个元素并将其应用到另一个元素，我还有一个CSS文件，其中包含这个新元素的样式，我检查代码，新元素存在并具有给定的ID和类名，但我的CSS未使用。代码如下所示：

var mainDiv=document.createElement("DIV");
mainDiv.id="ambiVid_controls";
mainDiv.className="ambiVid_controls";

Conts.parentNode.appendChild(mainDiv);

CSS：

.ambiVid_controls{
    position:absolute !important;
    bottom:15px ;
    width:60% !important;
    height:50px !important;
    margin-left:50% !important;
    background-color:#333 !important;
    z-index:1000 !important;

}

任何人都有任何想法为什么会被忽略或者是否存在ApplyChild和CSS的任何已知问题？

浏览器是Safari，如果这很重要。

Answer 1

可能没有正确添加div。因为它适用于http://jsfiddle.net/XDYbN/

Answer 2

如果您的CSS定义如此，则不必添加className属性：

#ambiVid_controls
{
    position:absolute !important;
    bottom:15px ;
    width:60% !important;
    height:50px !important;
    margin-left:50% !important;
    background-color:#333 !important;
    z-index:1000 !important;    
}

当然，如果要添加具有该ID值的多个元素，这将不起作用。

编辑：而不是：Conts.parentNode.appendChild（mainDiv）; ..如果Conts是DOM中现有元素的ID，就像说DIV一样 Conts.appendChild（mainDiv）;

CSS未分配给javascript创建的元素 - 为什么？

2 个答案: