从DOM替换表单，带有id的元素

问：

从DOM替换表单，带有id的元素

任务和遇到的问题的简要说明。

任务。服务网络页面。当您单击按钮（订购服务）时，将打开一个模式窗口（申请表）： 任务是接收一封带有服务申请的信函，并找出页面上 4 个按钮中的哪一个被按下了（即所选服务）

溶液。1）每张服务卡都是一个div（由img、p、button组成）。2）表单中有一个隐藏字段，我想为什么不手动分配按钮id（附图中的示例：冷玻璃），并为所有4个按钮分配相同的类。3） 编写一个脚本，其中函数找到特定按下的按钮的 id，并根据隐藏表单字段中的类替换它。

我写了下面的脚本，把它放在footer.php中，因为它在标题中不起作用，因为没有什么可显示的，页面还没有加载：

问题！！不管我按下四个按钮中的哪一个，我都会先得到 id。因此，如果 id 是个人的，我不明白为什么他会用第一个 dom 元素的值代替我。在我的代码中，我有一个门框。可以在代码中纠正我做错的事情的人。

<script lang="javascript">
    (function () {
        const buttonClassName = 'shop';
        const ids = ['field_4b68799'];

        for (const buttn of document.getElementsByClassName('shop')) {
            buttn.addEventListener("click", setTextForEmail);
        }

        const findForm = () => new Promise(resolve => {
            const intrv = setInterval(() => {
                ids.forEach(id => {
                    const fullId = 'form-field-' + id;
                    if (document.getElementById(fullId) != null) {
                        clearInterval(intrv);
                        resolve();
                    }
                });
            }, 100);
        });

        function setTextForEmail() {
            findForm().then(() => {
                ids.forEach(id => {
                    const fullId = 'form-field-' + id;
                    document.getElementById(fullId).value = document.getElementsByClassName(buttonClassName)[0].getElementsByTagName('a')[0].getAttribute('text');
                });
            });
        }
    })();
</script>