Das Details-Tag in HTML5 und die jQuery-Implementierung

Last updated 1. Februar 2023

HTML5

Laut W3school hat HTML5 ein neues Tag hinzugefügt, Details. Seine Beispielverwendung ist:

<details>
  <summary>Computing & Technology.</summary>
  <a class="vglnk" target="_blank" href="https://helloacm.com" rel="nofollow"><span>https</span><span>://</span><span>helloacm</span><span>.</span><span>com</span></a>
</details>

Wenn Ihr Browser HTML5 unterstützt und dieses Tag unterstützt, sehen Sie Folgendes funktionieren (erweiterbares Tag, zum Ein- und Ausblenden klicken, entfernt, da AMP diese HTML5 – Tags nicht zulässt):

▶ Computing & Technology.

Leider unterstützen dies nicht alle Browser wie Microsoft IE oder Edge-Browser. Aber Sie können immer jQuery (oder reines Javascript) verwenden, um die gleichen Effekte zu erzielen (mindestens 99 % ähnlich).

▶ Computer & Technologie.

Der Quellcode ist:

jQuery(document).ready(function() {
  jQuery('#example_label1').click(function() {
     jQuery('#example_d1').toggle();
  });
});

Zwei HTML-Divs sind definiert: example_label1 und example_d1. Das Unicode- Dreieck Quadrate rechts wird in unten umgewandelt, aber dies wird in diesem einfachen jQuery- Ersatz nicht berücksichtigt .

Anscheinend verwenden Sie einen Werbeblocker. Aber ohne Werbeeinnahmen können wir diese Seite nicht weiter großartig machen. Ich verstehe, ich habe meinen Werbeblocker deaktiviert.

Aufnahmequelle: helloacm.com