Javascript HTML行不'；无法在浏览器中显示

我通过jquery用行填充HTMLTbody，它不会在浏览器中显示新行，但如果我尝试在chrome控制台中查看tbody内容，它会显示HTML，但不会在浏览器中显示

代码：Javascript

函数initTables（）{
合并对象（statsGroup.obamaFollowers.lang，statsGroup.trumpFollowers.lang，'lang'）；
addRowToTable（statsGroup.mergedFollowers['lang']，“tblLanguageGroup”）；
合并对象（statsGroup.obamaFollowers.timeZone、statsGroup.timeZone、“timeZone”）；
AddRowtTable（statsGroup.mergedFollowers['timeZone']，“tblTimeZone”）；
合并对象（statsGroup.obamaFollowers.age、statsGroup.trampfollowers.age、“age”）；
AddRowtTable（statsGroup.mergedFollowers['age']，“tblAgeGroups”）；
}
函数AddRowtTable（数据，tblId）{
var rowHtml=''；
Object.keys（数据）.forEach（函数（键，索引）{
rowHtml+=“”；
rowHtml+=''+键+''+数据[键][0]+''+数据[键][1]+''；
rowHtml+=“”；
});
$（“#”+tblId.find（'tbody'）.append（rowHtml）；
}
函数MergeObjects_ToArry（obj1，obj2，keyName）{//obama，特朗普
var-obama=jQuery.extend（true，{}，obj1）；
var-trump=jQuery.extend（true，{}，obj2）；
Object.keys（obama）.forEach（函数（键，索引）{
if（特朗普[key]）{//if key存在于small中
obama[key]=[obama[key]，trump[key]；//在数组中合并值
}
否则{
obama[key]=[obama[key]，'N/A']；//key仅在obj1中，因此将其添加到mergedObj中
}
});
statsGroup.mergedFollowers[keyName]=奥巴马；
//合并特朗普的关键点奥巴马不在场
}

代码：HTML

@*特朗普和奥巴马的账户年龄比较*@
特朗普和奥巴马的账户年龄比较
账龄
王牌
奥巴马
@*特朗普和奥巴马的时区比较*@
特朗普和奥巴马的时区比较
时区
王牌
奥巴马
@*特朗普和奥巴马的语言比较*@
特朗普和奥巴马的语言比较

在浏览器中：

TLDR：

---

我有来自api的数据，我尝试填充三个html表，只有一个用新数据显示，另外两个在我签入控制台时有数据，但它们没有显示。

您是否尝试对添加图表“timeZoneChart”的行进行注释？您的api正在发送时区数据

那么，

statsGroup.obamaFollowers.timeZone

会在控制台中显示返回的数据吗？你有什么错误吗？

MergeObjects\u ToArry（）

看起来像什么（你确定你的数据被附加到一个新数组中了吗？“statsGroup.obamaFollowers.timeZone”在控制台中显示数据。控制台中有一个错误，但这与BrowserLink有关，我认为这与问题无关。MyGeObjutsStoRayy（）很好，我已经检查过了。如果时间允许，可以考虑使用插件。如果这是一个大项目，我会推荐它。它有很多用于添加/删除/刷新数据的内置功能。是的，我确实喜欢dataTables，但这只是一个小项目，我在其中只有很少的表，我尝试过datatable。它与引导css冲突，我不想重写某些内容。所以我从api中获取数据，并尝试填充三个html表格只有一个显示新数据，另外两个在我签入控制台时有数据，但它们不显示。

function initTables() {
MergeObjects_ToArry(statsGroup.obamaFollowers.lang, statsGroup.trumpFollowers.lang, 'lang');
addRowToTable(statsGroup.mergedFollowers['lang'], "tblLanguageGroup");

MergeObjects_ToArry(statsGroup.obamaFollowers.timeZone, statsGroup.trumpFollowers.timeZone, 'timeZone');
addRowToTable(statsGroup.mergedFollowers['timeZone'], "tblTimeZone");

MergeObjects_ToArry(statsGroup.obamaFollowers.age, statsGroup.trumpFollowers.age, 'age');
addRowToTable(statsGroup.mergedFollowers['age'], "tblAgeGroups");
}

function addRowToTable(data, tblId) {
var rowHtml = '';

Object.keys(data).forEach(function (key, index) {
    rowHtml += "<tr>";
    rowHtml += '<td>' + key + '</td><td>' + data[key][0] + '</td><td>' + data[key][1] + '</td>';
    rowHtml += "</tr>";
});

$("#" + tblId).find('tbody').append(rowHtml);
}

function MergeObjects_ToArry(obj1, obj2, keyName) {//obama , trump
var obama = jQuery.extend(true, {}, obj1);
var trump = jQuery.extend(true, {}, obj2);

Object.keys(obama).forEach(function (key, index) {
    if (trump[key]) {//if key exists in small
        obama[key] = [obama[key], trump[key]];// Merge values in ARRAY
    }
    else {
        obama[key] = [obama[key], 'N/A']; // key is in only obj1 so add it in mergedObj
    }
});

statsGroup.mergedFollowers[keyName] = obama;
//merge keys in trump not present in obama
}

<div id="statsCharts" class="chartsSection" style="display:none;">
@*Account Age Comparision Trump vs Obama*@
<div class="row">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4>
                    Account Age Comparision Trump vs Obama
                </h4>
            </div>
            <div id="ageChart" class="dvChart"> </div>
            <div class="dvScrollable" style="display:none;">
                <table id="tblAgeGroups" class="table table-condensed tablesorter">
                    <thead>
                        <tr>
                            <th>Account Age</th>
                            <th>Trump</th>
                            <th>Obama</th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
    </div>
</div>

@*Time Zone Comparision Trump   vs Obama*@
<div class="row">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4>
                    Time Zone Comparision Trump vs Obama
                </h4>
            </div>
            <div id="timeZoneChart" class="dvChart" style="position: relative; width: 960px; height: 800px;"> </div>
            <div class="dvScrollable" style="display:none;">
                <table id="tblTimeZone" class="table table-condensed tablesorter">
                    <thead>
                        <tr>
                            <th>Time Zone</th>
                            <th>Trump</th>
                            <th>Obama</th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
    </div>
</div>

@*Language Comparision Trump    vs Obama*@
<div class="row">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4>
                    Language Comparision Trump vs Obama
                </h4>
            </div>
            <!-- Chart -->
            <div id="langGroupChart" class="dvChart"> </div>
        </div>
    </div>
</div>