刪除沒有值的 HTML 屬性

Question

我有一個 R閃亮應用程序，帶有 R閃亮包中的導航欄。 但是，我對輸出 HTML 感興趣，因此這裡不需要 R 特定知識。

如果先前已選擇這些選項卡，則透過此導覽列進行 Tab 鍵切換會跳過這些項目。這是因為，當選擇一個標籤時，shiny 會將 class="active" 新增到導覽列中該標籤的

元素。然後，當您按一下該標籤時，它會刪除 ="active"，只剩下

。根據空類屬性是否有效 HTML？這是無效的 HTML，這一定是透過導覽列進行 Tab 鍵切換失敗的原因

我想刪除這些沒有值的類別目標。我嘗試使用 jquery 通過添加來做到這一點

$(document).on('hide.bs.tab', (x) => {
    $('*[class!=*]').removeAttr('class');

每當選擇新選項卡時刪除所有這些目標。然而，我認為這會造成一些額外的混亂，因為應用程式中的其他功能現在已被破壞 - 可以預見，這是一種非常暴力的方法。問題是這個 HTML 無效，我不知道如何正確選擇它！

如果有人可以就解決此問題的策略提出建議，那就太好了。謝謝！

Answer 1

對空類別使用屬性[]選擇器，例如：[class=""]

$('[class=""]').removeAttr("class");

[class] {
  background: red;
}

<div class="foo">class="foo"</div>
<div class="">class=""</div>
<div class>class</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>

在純 JavaScript 中，你會這樣做：

document.querySelectorAll('[class=""]').forEach(el => el.removeAttribute("class"));

[class] {
  background: red;
}

<div class="foo">class="foo"</div>
<div class="">class=""</div>
<div class>class</div>

無需載入整個函式庫。