0

我的网站通过 iframe 显示一个页面（来自远程服务器）。我没有对此页面的 html 控件，但我可以在位于同一远程服务器上的 JS 文件中添加 javascript 代码（无 jquery）。

HTML

    <li id='row_force_language'><label for='row_force_language'>Language</label><select id='force_language' name='force_language' >
    <option  value="CA" >CA</option>
    <option  value="CS" >CS</option>
    <option  value="DA" >DA</option>
    </select>

这个 html 被这个 css 隐藏（存在于远程服务器上的样式表中）：

    #row_force_language {display: none;}

现在，如果我在 JS 文件中添加此代码，则 html 不会变得可见：

    document.getElementById('row_force_language').style.display='inline-block';

我的 JS 代码错了？或者只是不可能？

（之前的 CSS 代码有“重要”属性。我删除了“重要”但我仍然无法显示隐藏元素。）

4

2 回答 2

0

确实!important是阻止了这种内联样式的应用。要么去掉!importantCSS 中的 ，要么在 JS 中添加一个：

document.getElementById('row_force_language').style.display='inline-block !important';

但是，请注意，您已经开始让自己陷入一场特异性战争。我不能建议您尽可能多地!important避免使用该声明。

于 2013-11-13T00:15:29.837 回答
0

内联样式通常比 ID 选择器具有更高的特异性，除非选择器具有 !important 关键字。

带有 !important 关键字的内联样式将优先于带有 !important 关键字的 #id 选择器。

话虽如此，这将起作用：

document.getElementById('test').setAttribute('style','display:inline-block !important');

在此处查看示例：http: //codepen.io/anon/pen/tuKEm

于 2013-11-13T00:17:33.530 回答