Entfernen Sie HTML-Attribute ohne Wert

Question

Ich habe eine R-Shiny-App mit einer Navigationsleiste aus dem R-Shiny-Paket. Da ich jedoch an der Ausgabe von HTML interessiert bin, sind hier keine R-spezifischen Kenntnisse erforderlich.

Wenn Sie durch diese Navigationsleiste navigieren, werden diese Einträge übersprungen, wenn diese Registerkarten zuvor ausgewählt wurden. Dies liegt daran, dass es glänzend wird, wenn eine Registerkarte ausgewählt wird. Ist HTML basierend auf einem leeren Klassenattribut gültig? Das ist ungültiges HTML. Das muss der Grund dafür sein, dass das Durchsuchen der Navigationsleiste mit der Tab-Taste fehlschlägt class="active" 添加到导航栏中该选项卡的

元素。然后，当您单击该选项卡时，它会删除 ="active"，只剩下

Ich möchte diese Klassenziele entfernen, die keinen Wert haben. Ich habe versucht, dies mit jquery zu tun, indem ich

hinzugefügt habe

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

Entfernen Sie alle diese Ziele, wenn ein neuer Tab ausgewählt wird. Ich denke jedoch, dass dies für zusätzliche Verwirrung sorgen wird, da andere Funktionen in der App jetzt nicht mehr funktionieren – vorhersehbar ist dies ein sehr brutaler Ansatz. Das Problem ist, dass dieser HTML-Code ungültig ist und ich nicht weiß, wie ich ihn richtig auswählen soll!

Es wäre großartig, wenn jemand eine Strategie zur Lösung dieses Problems vorschlagen könnte. Danke!

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>

无需加载整个库。