如何从jquery插件强制CSS样式

Question

我创建了一个小的自动完成jQuery插件，它将在附加到的文本框之后插入div，并且我将从插件所使用的每个页面继承样式。

所以我的每个自动填充框看起来都不一样。

有没有办法在动态创建div上强制样式？

Answer 1

我不惜一切代价避免使用！important ，但有时必须使用它作为最后的手段（例如，jqxWidgets使用内联样式将许多样式直接放在元素上，因此很难避免定制没有！重要）。

首选方法是指定比库使用的特异性更高的css选择器。

所以＃1是确保你的样式在库样式之后加载：最后一个在wins中。但特异性也很重要。如果图书馆的css选择器比你的css选择器更具特色，那么即使你的第二次加载它也会获胜。

那么特定选择器的例子是什么？

如果 DOM 看起来像这样

<div class="foo">
    <ul>
        <li>
            <span class="bar">something</span>
        </li>
    </ul>
</div>

然后这种类型的选择器将是非常具体的b / c它将这种特定类型的DOM结构考虑在内。

.foo > ul li .bar { /* style goes here */ }

自定义第三方库是一个可以制作最具体的css选择器的游戏。

Answer 2

如果div已经在dom中，您可以通过添加！important

轻松完成

$（＆＃34; DIV＆＃34）。CSS（＆＃34;宽度＆＃34;＆＃34; 100％＆＃34;＆＃34;重要＆＃34）;

如果您还没有尝试过，请查看其他脚本是否已经放置了样式＆＃34;继承＆＃34;在你的元素上。