何时以及如何在具有跨域的书签中使用！重要的CSS属性？

Question

我有一个bookmarklet，最近我使用cleanslate css更改了CSS属性，因为在使用时，第三方网站上的书签设计不一样。

这个css文件应该重置特定标签内所有标签的所有属性，并且这样做，但是当我需要操作设置时，我不能;

<div class="mainclass">
<div id="login">a</div>
<div id="form">b</div>
<div id="details">c</div>
</div>

我有很多表单，我隐藏和取消隐藏在特定的操作，例如：我显示登录表单，如果用户未登录，我显示详细信息表单，如果用户已登录，如果我知道网址的历史和其他形式;

所以，如果我将div id details display属性设置为block，其余属性设置为none，然后尝试将所有属性设置为none和{{1} } div id form display的属性，block它没有做任何事情，但我可以看到css运行动作

这个css应该可以完成这项工作，但是因为我在所有标签属性上都使用了！important属性，所以我无法将javascript新值设置为属性，例如：

javascript

在这张图片中，我使用旧的CSS，使用了重置方法，而且，js代码工作正常，但第三方网站上的设计不一样

在实际项目中，所有第三方网站的设计都是一样的，但是js代码无法设置css属性

Answer 1

一般来说，重要的是一个非常糟糕的想法，应该尽量避免，因为它违反了CSS中的特异性规则。你有没有办法让你的CSS更具体地覆盖当前的样式而不是使用！importnat。

你仍然可以通过做这样的事情来应用importnant

element.style.setProperty("display", "none", "important");

或者jquery让它变得非常容易

element.css("display","none !important");

但最好不要使用重要的