将CSS规则添加到使用JavaScript添加的元素

问题描述：

我正在使用JavaScript创建并向li添加li。创建和添加元素正在工作;但是，这些元素没有采用我在外部文件中声明的CSS规则。当我用PHP显示服务器端的元素时，一切正常，但当我使用Js时，CSS规则不适用。我不想在每个元素上使用.style，因为我有很多规则。将CSS规则添加到使用JavaScript添加的元素

对此提出建议？

编辑：guys/gals，我真的很抱歉。我刚才意识到，我已将单次使用的类更改为我的CSS文件中未更改的ID。 THX @jeff

你介意jQuery吗？ – 2012-07-22 20:19:15

我会用Firebug检查生成的HTML，以验证与PHP一样正在使用Javascript生成完全相同的HTML。 – jeff 2012-07-22 20:19:27

@ScottSelby我使用jQuery来处理其他事情，所以我不介意使用它。 – paulruescher 2012-07-22 20:21:40

答

根据*您是如何添加这些元素，你可以做两件事情之一......

如果你正在写在他们的innerHTML你只需要添加类声明的一部分，你的串...

innerHTML = "<li class='myLIClass'>";

如果你直接将它们添加到DOM为元素添加类是这样的：

myNewListItem.className = 'myLIClass';

或

myNewListItem.createAttribute('class','myLIClass')

答

在创建元素只是做

$('#newdiv').addClass('classname');

答

通过你的HTML生成无关的方法。 CSS应用于所有元素，无论它们是否是动态生成的。因此，可以达到的逻辑结论是您从Javascript生成的HTML，并且从PHP生成的HTML在某些方面有所不同。

要确定HTML的差异，可以使用Firebug等浏览器扩展来检查HTML。那么你就可以纠正可能存在的任何分歧。

将CSS规则添加到使用JavaScript添加的元素

相关推荐