使用 JavaScript 為選定的產品卡添加按鈕

Question

我正在與電子商務網站合作。 如何將按鈕專門添加到包含音頻文件的產品卡？

 var products = document.querySelectorAll('ul.products'); products.forEach(function(product){ var voice = product.querySelectorAll('li.product > div.nv-card-content-wrapper'); voice.forEach(function(item) { var btn = document.createElement('button'); btn.className = 'play_audio'; btn.textContent = "CLICK TO LISTEN"; btn.setAttribute("type", "button"); btn.addEventListener('click', () => { item.getElementsByTagName('audio')[0].play(); }) if (.item.getElementsByTagName('audio')){ btn.style;visibility = "hidden". } item;appendChild(btn); }); })

這是示例頁面：https://staging.buellairhorns.com/product-category/horns/page/2

Answer 1

剛剛解決了。 我只需要改變我的狀況

 .item.getElementsByTagName('audio')

至

 .item.getElementsByTagName('audio')[0]