Question

我有一个带有div（divSInfo）的模态对话框，当点击一个按钮时，我正在用动态生成的表替换它。

该表确实出现了，但我得到了7＆lt; BR＆GT;在表格之前出现的标签。在控制台中查看，生成的表不包含这些标记。

任何人都知道如何消除流氓＆lt; BR＆GT;标签

这是模态对话框：

<div id="modalViewS" class="modal fade" role="dialog">       
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">View</h4>
                </div>
                <div class="modal-body">
                    <div>
                        <p>If any of this information is incorrect, please delete the entry and add it again</p>
                        <div id="divSInfo"></div>
                    </div>
                </div>
                <div class="modal-footer">
                    <div style="text-align: right;">
                        <button id="btnViewSOK" type="button" class="btn btn-primary" data-dismiss="modal" runat="server">OK</button>
                    </div>
                </div>
            </div>
        </div>
    </div>

我使用以下内容获取表格：

var getJSON = function () {
return new Promise(function (resolve, reject) {
    var xhr = new XMLHttpRequest();
    xhr.open('post', "SomePage.aspx?REQ=myvars", true);
    xhr.responseType = 'json';
    xhr.onload = function () {
        var status = xhr.status;
        if (status == 200) {
            resolve(xhr.response);
        } else {
            reject(status);
        }
    };
    var reqjson = JSON.stringify({
        VarID: asiid
    });

    xhr.send(reqjson);
});
};

getJSON().then(function (data) {
console.log(data);
var a = data.TableData.replace("<br/>", "");
console.log(a);
$('#divSInfo').replaceWith(a);
}, function (status) {
    //alert('Something went wrong.');
});

控制台报告“a”返回为：

<table class="table table-bordered"><tr class="tableheader_bg"><th>Question</th><th>Answer</th></tr><tr><td>S. Description</td><td>fvbbnvfn</tr><tr><td>S. Length</td><td>7 Seconds</tr><br/><tr><td>Loss?</td><td>No</tr><br/><tr><td>Warning?</td><td>No</tr><br/><tr><td>S Onset</td><td>7</tr><br/><tr><td>Occurs</td><td>Out of Sleep</tr><br/><tr><td>Has S resulted in injury?</td><td>No</tr><br/><tr><td>S Classification</td><td>Impaired</tr></table>

但实际页面呈现如下：

<div>
<p>If any of this information is incorrect, please delete the entry and add it again</p>
<br><br><br><br><br><br><table class="table table-bordered"><tbody><tr class="tableheader_bg"><th>Question</th><th>Answer</th></tr><tr><td>S. Description</td><td>fvbbnvfn</td></tr><tr><td>S. Length</td><td>7 Seconds</td></tr><tr><td>Loss?</td><td>No</td></tr><tr><td>Warning?</td><td>No</td></tr><tr><td>S Onset</td><td>7</td></tr><tr><td>Occurs</td><td>Out of Sleep</td></tr><tr><td>Has S. resulted in injury?</td><td>No</td></tr><tr><td>S. Classification</td><td>Impaired</td></tr></tbody></table>

Answer 1

当浏览器遇到无法解释的html时，可能会发生奇怪的事情。在你的情况下，你有一些不属于你的表行之间的html，所以不是丢失那个html，浏览器将它移动到树上直到它有效，在这种情况下就在表格的上方。

我认为那些是提供间距，但间距为should instead be added with CSS。

用表替换div会在表之前给出多个<br/>标签

1 个答案: