Javascript 无法在html页面上显示响应数据

我从ajax查询中获得了响应数据，我可以在console.log函数中看到这些数据。但是现在我想显示存储在对象中的用户名

display.html

devlope.js

user.js

现在，当我从devlope.js调用ReadUser时，所有的对象值都是正确的，这意味着ReadUser变量中的所有数据都是正确的。 现在，在display.html中，我想显示从响应中获得并存储在field readUser.name中的字段名

---

但我不确定如何访问中Hello旁边的readUser.name。

一种方法是在HTML中使用span元素：

<i class="fa fa-smile-o" >
    <span id="readusername"></span>
</i>

把这个

<i class="fa fa-smile-o" >
  <span id="yourSpanID"></span>
</i>

---

我应该把这个document.querySelector放在哪里？就在脚本收到用户名后，您将它打印到控制台的地方。这将是回调ReadUser。如果我没有弄错你的密码。不确定这是否是好的代码设计，但它应该适用于第一次测试。

(function (){
    "use strict";
    var root = this;
    var users;
    if (typeof exports !== 'undefined') {
        users = exports;
    } else {
        users = root.users = {};
    }

    var user = users.user = function () {
        this.ap = [];
        this.tg = [];
        this.userdetails = [];
    };

    var user = users.user = function (username, userpassword) {
        this.username = username;
        this.name = "";
        this.userpassword= userpassword;
        this.ap = [];
        this.tg = [];
        this.userdetails = [];
        this.url = "http://localhost/RestApi/ReadUser";
    };

    user.prototype.fillUserDetail = function ( response, handle) {
        var obj = JSON.parse(response);
        handle.name = obj.name;
        handle.username = obj.login;
        if(obj.AccountDetail)
        {
            handle.userdetails = obj.AccountDetail;
        }
        if(obj.ap)
        {
            handle.ap = obj.ap;
        }
        if(obj.tg)
        {
            handle.tg = obj.tg;
        }
    };

    user.prototype.PrintUserDetail = function(){
        console.log(this.username);
        console.log(this.name);
        console.log(this.userdetails);
        console.log(this.ap);
    };

    user.prototype.ReadUserDetail = function (username, userpassword)
    {
        this.username = username;
        this.userpassword = userpassword;
        var sentdata = {"login":this.username, "pwd":this.userpassword};
        var callback = this.fillUserDetail;
        var localhandle = this;
        $.ajax({
            type: "POST",
            url: this.url,
            data: JSON.stringify(sentdata),
            contentType: "application/json",
            success: function(response){
                callback(response, localhandle);
            },
            error: function (xhr, thrownError) {
                alert(thrownError);
            },
            async: false
        });
    };
}).call(this);

<div class="col-style">
    <div class="sparkboard" id="sparkboard-1"></div>
    <div class="sparkboard-info">
        <i class="fa fa-smile-o" >Hello <readUser.name> ???
        </i>
    </div>
</div>

<i class="fa fa-smile-o" >
    <span id="readusername"></span>
</i>

document.querySelector('#readusername').textContent = readUser.name;

<i class="fa fa-smile-o" >
  <span id="yourSpanID"></span>
</i>

<i class="fa fa-smile-o" >Hello <readUser.name> ???
        </i>

$('#yourSpanID').textContent = readUser.name;