{"id":3373,"date":"2026-03-21T18:34:02","date_gmt":"2026-03-21T17:34:02","guid":{"rendered":"https:\/\/digitalia.culturanuova.net\/blog\/?p=3373"},"modified":"2026-03-21T18:38:36","modified_gmt":"2026-03-21T17:38:36","slug":"how-to-toggle-the-open-details","status":"publish","type":"post","link":"https:\/\/digitalia.culturanuova.net\/blog\/?p=3373","title":{"rendered":"How to toggle the opened &lt;details>"},"content":{"rendered":"\n<p>If you have two &lt;details> tags, and you want to close one, when you open the other, you can use this short js:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;script>\nconst details = document.querySelectorAll(\"details\");\n\ndetails.forEach(d => {\n  d.addEventListener(\"toggle\", () => {\n    if (d.open) {\n      details.forEach(other => {\n        if (other !== d) {\n          other.removeAttribute(\"open\");\n        }\n      });\n    }\n  });\n});\n&lt;\/script><\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>If you have two &lt;details> tags, and you want to close one, when you open the other, you can use this short js:<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[885,747,566],"tags":[726],"class_list":["post-3373","post","type-post","status-publish","format-standard","hentry","category-code","category-javascript","category-webmaster","tag-details"],"_links":{"self":[{"href":"https:\/\/digitalia.culturanuova.net\/blog\/index.php?rest_route=\/wp\/v2\/posts\/3373","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/digitalia.culturanuova.net\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/digitalia.culturanuova.net\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/digitalia.culturanuova.net\/blog\/index.php?rest_route=\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/digitalia.culturanuova.net\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3373"}],"version-history":[{"count":2,"href":"https:\/\/digitalia.culturanuova.net\/blog\/index.php?rest_route=\/wp\/v2\/posts\/3373\/revisions"}],"predecessor-version":[{"id":3375,"href":"https:\/\/digitalia.culturanuova.net\/blog\/index.php?rest_route=\/wp\/v2\/posts\/3373\/revisions\/3375"}],"wp:attachment":[{"href":"https:\/\/digitalia.culturanuova.net\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3373"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/digitalia.culturanuova.net\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=3373"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/digitalia.culturanuova.net\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=3373"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}