html - 以编程方式删除 CSS 类文件 - jQuery

Question

我正在使用该jQueryUI库来利用页面上的选项卡，并且选项卡的 CSS 样式正在应用于div标签内的内容。

当我使用 Chrome 开发人员工具时，我将其范围缩小到 jquery-ui.css 类中的以下 CSS 类：

.ui-widget {
    /*font-family: Verdana,Arial,sans-serif;*/
    font-size: 1.1em/*{fsDefault}*/;
}
.ui-widget .ui-widget {
    font-size: 1em;
}

如何从我的div内容容器中删除这些 CSS 样式。我尝试了以下 jQuery 代码段，但没有成功。

$("#nameSearch").removeClass("ui-widget");

这是我的 HTML 页面的片段：

<div id="searchTabs">
    <ul>
        <li><a href="#nameSearch">Name</a></li>
        <li><a href="#caseNumberSearch">Case Number</a></li>
    </ul>
    <div id="nameSearch">
        <b>First Name:</b>&nbsp;<asp:TextBox ID="txtFirstNameSearch" runat="server" CssClass="txt" /><br />
        <b>Last Name:</b>&nbsp;<asp:TextBox ID="txtLastNameSearch" runat="server" CssClass="txt" /><br />
        <b>Date of Birth:</b>&nbsp;<asp:TextBox ID="txtDateOfBirth" runat="server" CssClass="txt" /><br />
    </div>
    <div id="caseNumberSearch">
        <b>Case Number:</b>&nbsp;<asp:TextBox ID="txtCaseNumberSearch" runat="server" CssClass="txt" /><br />
    </div>
</div> 

Answer 1

如果您知道这些 CSS 规则的位置，那么：

IE

document.styleSheets[0].removeRule(i);

//i = position of the rule.

其它浏览器

document.styleSheets[0].deleteRule(i);