前提・実現したいこと
ここに質問の内容を詳しく書いてください。
STUDIOというサービスでサイト制作をしています。
アコーディオン機能を実装したいので、
GoogleタグマネージャーのカスタムHTMLを使って、コードを記入していましたが
アコーディオンがうまく動いてくれません。
Uncaught TypeError: Cannot read properties of null (reading 'style') at <anonymous>:1:177 at gtm.js?id=GTM-WC86WZW:246 at gtm.js?id=GTM-WC86WZW:247 at gtm.js?id=GTM-WC86WZW:247 at c (gtm.js?id=GTM-WC86WZW:248) at Ic (gtm.js?id=GTM-WC86WZW:46) at e (gtm.js?id=GTM-WC86WZW:126) at gtm.js?id=GTM-WC86WZW:31 at Array.<anonymous> (gtm.js?id=GTM-WC86WZW:127) at Object.execute (gtm.js?id=GTM-WC86WZW:127)
該当のソースコード
<style> .accordion__answer--active { height: auto !important; padding-top: 16px !important; } </style> <script> "use strict"; var accordion = document.querySelector("#accordion"); var accordionItems = document.querySelectorAll("div[id*='accordion__item']"); accordion.style.cursor = "pointer"; accordion.addEventListener("click", function (e) { e.preventDefault(); var clickedAccordionItem = e.target.closest("div[id*='accordion__item']"); if (!clickedAccordionItem) return; var clickedAccordionAnswer = clickedAccordionItem.children[1]; accordionItems.forEach(function (accordionItem) { accordionItem.children[1].classList.remove("accordion__answer--active"); }); clickedAccordionAnswer.classList.add("accordion__answer--active"); }); </script>Googleタグマネージャー JS
試したこと
Googleタグマネージャーとの連携はできています。
補足情報(FW/ツールのバージョンなど)
この記事を参考に実装をしています
https://studio-gaz.design/blog/studio-gtm-accordion
こちらのホームページにて実装させようとしています
https://kiyohiro728.com/
あなたの回答
tips
プレビュー