Question

我想弄清楚如何从插件中删除一些按钮。我不想更改插件代码，因为我将无法再获得更新。问题是我不能使用css rules display：none，因为我希望列表中的2个按钮保留，并且所有按钮都具有相同的类名。

代码如下：

<div class="cdm_nav_buttons" id="cdm_nav_buttons">
    <a href="#upload" class="sp_cdm_add_file hide_add_file_permission">
        <i class="fa fa-plus-circle" aria-hidden="true"></i> Add File
    </a>
    <a href="#add-link" class="sp_cdm_add_file hide_add_file_permission" style="
        ">Add Link</a>
    <a href="#add-embed" class="sp_cdm_add_file hide_add_file_permission">Embed Video</a>
    <a href="#folder" class="sp_cdm_add_folder hide_add_folder_permission">
        <i class="fa fa-folder" aria-hidden="true"></i> Add Folder
    </a>
    <a href="javascript:cdm_ajax_search()" class="sp_cdm_refresh">
        <i class="fa fa-refresh" aria-hidden="true"></i> Refresh
    </a>
    <div style="clear:both"></div>
</div>

我只想留下两个按钮。如何在不编辑源代码的情况下执行此操作？感谢

Answer 1

您可以通过:nth-*伪类（检查here）或属性选择器（检查here）使用CSS。两者都非常灵活，你应该能够用这些技巧来做。

示例：

div.cdm_nav_buttons a:nth-child(2), div.cdm_nav_buttons a:nth-child(3) {
    display:none;
}

或

a[href="#upload"], a[href="#folder"] {
    display:none;
}

Answer 2

您可以使用:nth-child()选择器：例如：

.cdm_nav_buttons a:nth-child(2){
  display:none;
}

这只会“移除”<a> div中的第二个cdm_nav_buttons。

而不是a你也可以使用它的类：

.cdm_nav_buttons .sp_cdm_add_file:nth-child(2){
      display:none;
    }

Answer 3

你可以试试这样的事情

.cdm_nav_buttons a:nth-child(5){
  display: none;
}

.cdm_nav_buttons a:nth-child(2){
  display: none;
}

可以在此处找到更多信息：https://www.w3schools.com/cssref/sel_nth-child.asp

从插件中删除按钮

3 个答案: