Вставьте динамический сценарий события onClick в Google Optimize

Question

Мне нужно добавить элемент HTML, кнопку, через эксперимент Google Optimize, и он должен выполнить определенный сценарий в зависимости от эксперимента.

Я попытался сделать это следующими способами:

<button id="my-button">Show</button>


var script = document.createElement('script');
var inlineScript;
script.appendChild(inlineScript); 
element.appendChild(script);

содержимое переменной inlineScript:

1.
    'document.createTextNode('document.addEventListener("click",function(e){ if(e.target && e.target.id== "my-button"){ console.log("test"); } }); );');'


2.
    'document.createTextNode('var myButtonElement = document.getElementById(
    "my-button");
    myButtonElement.addEventListener("click", function()
    { console.log("test");});')'

Однако ни один из подходов не работает. Когда я жестко кодирую код из бэкэнда, он работает нормально, но его нужно динамически добавлять через Optimize. Есть ли другой способ добавить динамический HTML-скрипт в HTML?

Answer 1

Вполне возможно, что есть способ сделать это только с помощью инструмента Google Optimize, однако я не смог этого сделать.

Чтобы решить эту проблему, я определил функцию и переменную, которые задаются в заголовке инструмента CMS, а затем в функции оптимизации я просто делаю следующее:

1. Кнопка с моей функцией
2. Скрипт, добавленный к элементу, чтобы установить переменную со значением, которое мне нужно:

var script = document.createElement('script');
var inlineScript = document.createTextNode("myValue= '123'");
element.appendChild(script);