js控制button元件显示问题

Question

初学者，最近在尝试写一个自用脚本，但button的显示出现问题，想请教一下应如何修改以达到目的
我是想把button挂载在Class="filter-tools"的元素下，但打开网站脚本不显示button，而同样的代码在控制台运行却是可以正常显示button的；我也试了其他的元素，也是同样的结果，而只有直接挂载在body下，打开网址脚本是可以正常显示button的，但button的位置在页面最下面，需要拉到底才能看到。
脚本匹配的网址：https://www.jisilu.cn/web/data/cb/list
脚本代码如下：

(function() {
    'use strict';
    var button = document.createElement("button"); 
    button.textContent = "可转债3.0"; 
    button.style.width = "90px"; 
    button.style.height = "28px"; 
    button.style.align = "center";
    button.style.color = "white"; 
    button.style.background = "#e33e33";
    button.style.border = "1px solid #e33e33"; 
    button.style.borderRadius = "4px"; 
    button.addEventListener("click", clickBotton) 
    button.style="z-index:999";
 function clickBotton(){
        setTimeout(function(){


},100);// setTimeout 0.1秒后执行
    }

var div = document.getElementsByClassName("filter-tools");//[0].getElementsByTagName("div");
var newdiv = document.createElement("div");
newdiv.setAttribute("id","sdbutton");
div[0].appendChild(newdiv);
document.getElementById("sdbutton").appendChild(button);
//document.body.append(button);
 //document.getElementsByClassName("el-tooltip custom-menu-btn")[0].appendChild(button);
})(); 

Answer 1

• 帮你找了个相似的问题, 你可以看下: https://ask.csdn.net/questions/7694070