Заменить html контент на Javascript в GTM

Question

Попытка заменить "sofort lieferbar" на "Lieferung auf Bestellung" на javascript, если класс "Availability Stati13" в Google Tag Manager.

<div class="availability stati13" style="">
sofort lieferbar

            <div class="blueinfo">
        <div style="display: none; opacity: 1;">in den nächsten Tagen Versandbereit</div>
    </div>
</div>

Сам Javascript работает нормально, но в GTM, ничего не произойдет, если запустить пользовательский тег html.

<script type="text/javascript">
function myFunction() {
  var str = document.querySelector(".availability.stati13").innerHTML; 
  var res = str.replace("sofort lieferbar", "Lieferung auf Bestellung");
  document.querySelector(".availability.stati13").innerHTML = res;
}
</script>

Кто-нибудь знает, почему этот скрипт в gtm не работает?

GTM работает нормально, я попробовал этот:

document.body.innerHTML = document.body.innerHTML.replace(/hello/g, 'hi');

Это бы сработало, но я не могу создать требование класса if

Answer 1

Вы определяете функцию myFunction(), но где вы ее выполняете? Возможно, вам следует написать ее как самовыполняющуюся функцию:

(function(){
    // your code here ...
})();

Также убедитесь, что этот тег выполняется в Dom готовом (чтобы ваш код мог найти искомые элементы)

dom-ready-trigger-in-google-tag-manager-quick-guide /

Также строка document.querySelector(".availability.stati13") вернет только первый элемент !. Если есть несколько элементов DOM с этим классом, вы должны обработать это для всех них с помощью querySelectorAll.

var elements = document.querySelectorAll(".availability.stati13");    
for (i = 0; i < elements.length; ++i) {
  var str = elements[i].innerHTML;
  elements[i].innerHTML = str.replace("sofort lieferbar", "Lieferung auf Bestellung");
}

Я использовал for вместо forEach для максимальной совместимости.