javascript - 将按钮添加到跨度

Question

我想向具有给定类的所有范围添加一个按钮。这个问题的答案仍然是首选的方法吗(我一直看到答案因过时而相互矛盾)？

adding onclick event to dynamically added button?

这是我的代码(到目前为止):

var button = document.createElement("button");
button.innerText = "Add test";

var allSpans = document.getElementsByTagName('span');

allSpans.forEach(function(span) {
    if(span.class == "behavior-header-title"){
        span. //i'd like to call something like addElement(button) here
    }
});

Answer 1

将 HTMLCollection 转换为数组并使用appendChild 附加按钮元素:

var allSpans = document.getElementsByTagName('span');

[].slice.call(allSpans).forEach(function(span) {
    if(span.className === 'behavior-header-title') {
        var button = document.createElement('button');
        button.innerText = 'Add test';
        span.appendChild(button);
    }
});

<span></span>
<span class="behavior-header-title"></span>
<span></span>
<span class="behavior-header-title"></span>