0

我在 javascript/DOM 中存储东西并提交 ajax 调用。当我这样做时,在成功和/或 .done 函数中:

$('#results').html(data);

javascript/DOM 模型已损坏,但当我这样做时:

var el = document.getElementById('results');
el.innerHTML = data;

然后一切都按预期工作。我知道这里没有太多信息,但我的问题是除了设置可能影响页面状态的 innerHTML 之外,jQuery html() 还能做什么。

4

2 回答 2

4

The main reason to use the html function with a string rather than innerHTML is to prevent memory leaks or inconsistent in memory data : this function removes event handlers or other jQuery data linked to the removed elements.

If data is a string, there is no reason for $('#results').html(data); to "corrupt" your DOM more than by using innerHTML.

于 2013-11-07T12:41:42.083 回答
1

在 Internet Explorer 9 和更早版本中,DOM 中的表是只读的。这意味着如果是 TBODY、TR 等,尝试这样做el.innerHTML = newHTML;会导致引发错误。jQuery函数通过使用回退方法为您处理这种情况 -在 jQuery 源代码中 - 允许您对所有代码使用相同的代码的浏览器,无论版本。el.html()this.empty().append(value)

可能值得看一下jQuery 源代码中的方法代码:

html : function (value) {
    return jQuery.access(this, function (value) {
        var elem = this[0] || {},
        i = 0,
        l = this.length;

        if (value === undefined) {
            return elem.nodeType === 1 ?
            elem.innerHTML.replace(rinlinejQuery, "") :
            undefined;
        }

        // See if we can take a shortcut and just use innerHTML
        if (typeof value === "string" && !rnoInnerhtml.test(value) &&
            (jQuery.support.htmlSerialize || !rnoshimcache.test(value)) &&
            (jQuery.support.leadingWhitespace || !rleadingWhitespace.test(value)) &&
            !wrapMap[(rtagName.exec(value) || ["", ""])[1].toLowerCase()]) {

            value = value.replace(rxhtmlTag, "<$1></$2>");

            try {
                for (; i < l; i++) {
                    // Remove element nodes and prevent memory leaks
                    elem = this[i] || {};
                    if (elem.nodeType === 1) {
                        jQuery.cleanData(getAll(elem, false));
                        elem.innerHTML = value;
                    }
                }

                elem = 0;

                // If using innerHTML throws an exception, use the fallback method
            } catch (e) {}
        }

        if (elem) {
            this.empty().append(value);
        }
    }, null, value, arguments.length);
}
于 2013-11-07T12:51:17.030 回答