Question

我有一个HTML元素，如下所示：

<p style="font:12px verdana !important;margin:20px !important;">…</p>

现在在某些时候我需要通过Javascript编辑margin属性。代码看起来像这样：

document.getElementsByTagName('div')[3].getElementsByTagName('p')[0].style.margin='0'
document.getElementsByTagName('div')[3].getElementsByTagName('p')[0].style.marginLeft = '150px'

但是，这不起作用。在我检查代码之前和之后的'margin'和'marginLeft'的值之后，值保持不变。如果我使用Google开发人员工具并手动更改Javascript，则问题就解决了。谁能告诉我为什么上面的代码没有改变风格的价值？我也尝试使用setAttribute，但这也不起作用。

Answer 1

您可以使用jquery尝试此操作：

$('selector').css('cssText','font:12px verdana !important;margin-left:150px !important;');

以这种方式制作，它会覆盖你的内联样式，所以如果你动态修改你的风格要小心

Answer 2

你可以使用jquery非常简单：

$( ".selector" ).css( "background-color","#fff" );

或者您可以通过这种方式访问您的元素

var elements = $( "body" ).find("div");
var p = elements[3].find("p");
$p[0].css("margin","0px");
$p[0].css("margin-left","150px");

如果您不想使用jQuery，那么首先检查您是否正在访问/选择正确的div和p标签，您可以提醒找到的元素的长度，并检查第3个元素是否有您要更新的元素？ / p>

无法使用Javascript编辑CSS样式

2 个答案: