发送xml http请求后如何打开弹出div？

Question

我正在构建一个可以帮助用户更轻松地使用特定网站的扩展程序。 现在我是 AJAX、XML 和所有类似的新手，所以这可能是一个简单的问题，但我不确定。

在该网站上，单击一个按钮后，它会发送 xmlhttprequest，并在收到一些信息后打开一个弹出 div（显示角色统计信息等，并具有该角色独有的按钮）。

现在我编写了与单击按钮后发送到服务器完全相同的 xmlhttprequest，但是在获取所要求的信息后，它没有打开任何东西（这是合乎逻辑的）但我不知道如何打开它。

var request = new XMLHttpRequest(),
    userz = '76561198364912967',
    url = 'https://www.[WEBSITE-NAME].com/api/v1/getuserinfo/?steam_64='+userz,
    data = 'steam_64=76561198364912967',
    token ='OAuth 3539383833353a313a7b66383738626464332d616536612d343132642d626466342d6136313462366164396139317d';

request.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        console.log("The request and response was successful!");
   }
};
request.open('GET', url, true);
request.setRequestHeader('Content-type', 'application/x-www-form-urlencoded; charset=UTF-8');
request.setRequestHeader('authorization', token);
request.send(data);

现在这是代码，我知道它可能不是我要求的这种语言，但我认为它是。

I get same response when clicking on button(that site has) and running my script

This is popup div's html code

This is how div looks

大渐变按钮对于每个打开 div 的角色都有不同的请求数据（点击后）。因此它必须与之前的请求有关。

目标不是制作一个什么都不做的弹出窗口，我需要触发创建具有某些功能的 div（就像那个网站所做的那样）

干杯！

Answer 1

尝试使用：request.responseText

像这样：

var res=request.responseText;//answer from application or server
var elm=document.createElement("div");
elm.innerText=res;
document.body.append(elm);

Answer 2

如果您想制作一个弹出窗口，这应该可以：

request.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
     let mod=document.createElement("DIV");
      document.body.appendChild(mod),mod.className="modal";
      let con=document.createElement("DIV");
      mod.appendChild(con),con.className="modal-content";
      let c=document.createElement("SPAN");
      c.className="close",
        c.innerHTML="×",
        c.setAttribute("onclick","this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode)"),
        con.appendChild(c);
      let p=document.createElement("P");
      con.appendChild(p),
        p.innerHTML=request.responseText;
   }
};

还有一些 CSS：

.modal{display:block;position:fixed;z-index:1;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.4)}.modal-content{background-color:#fefefe;margin:15% auto;padding:20px;border:1px solid #888;width:80%}.close{color:#aaa;float:right;font-size:28px;font-weight:700}.close:focus,.close:hover{color:#000;text-decoration:none;cursor:pointer}

Demo