Question

这是我的以下代码：

   <div class="w3-container" id="menuTopics">
          <button>
            <a href="//somesite.com/someparam"> 
                <img src="/images/keywordicons/leadership.svg" class="keyicon" />Leadership
            </a>
       </button>
       <button>.......</button>
 </div>

我想为这样的按钮设置一个onclick事件，它将保存href属性的值

   <div class="w3-container" id="menuTopics">
          <button onclick="window.location.href='//somesite.com/someparam'">
            <a href="//somesite.com/someparam"> 
                <img src="/images/keywordicons/leadership.svg" class="keyicon" />Leadership
            </a>
       </button>
       <button>.......</button>
 </div>

因为href保存了url的值，所以我希望onclick事件的值相同。这是我的要求。

以下是我写的javascript。

   var getChilds = document.querySelectorAll("#menuTopics button");
        getChilds.forEach(function (item) {
            item.setAttribute('onclick', 'location.href=""');

        })

但我不知道如何从 a 标记中获取href的值。

Answer 1

您需要获取href值才能分配它。

＆＃13;

var getChilds = document.querySelectorAll("#menuTopics button");
var href = document.getElementsByTagName('a')[0].href;
getChilds.forEach(function(item) {
  item.setAttribute('onclick', `location.href='${href}'`);
})


var buttons = document.getElementsByTagName('button');

console.log('these are your buttons with on click events', ...buttons)

＆＃13;

<div class="w3-container" id="menuTopics">
  <button>
            <a href="//somesite.com/someparam"> 
                <img src="/images/keywordicons/leadership.svg" class="keyicon" />Leadership
            </a>
       </button>
  <button>.......</button>
</div>

＆＃13;

在javascript中动态地将子元素的值设置为父元素的参数

1 个答案: