我正在进行ajax调用以获取内容并像这样附加内容：

$(function(){
    var site = $('input').val();
    $.get('file.php', { site:site }, function(data){
        mas = $(data).find('a');
        mas.map(function(elem, index) {
            divs = $(this).html();
            $('#result').append('' + divs + '');
        })
    }, 'html');
});

问题是，当我进行更改时a，body我什么也没得到（没有错误，只有html）。我假设body是一个标签，就像“ a”一样吗？我究竟做错了什么？

所以这对我有用：

 mas = $(data).find('a');

但这不是：

 mas = $(data).find('body');

恐怕通过jQuery对象（即$(data)）解析返回的HTML以获取body标记注定会失败。

原因是返回的data是string（try console.log(typeof(data))）。现在，根据jQuery文档，当从包含复杂HTML标记的字符串创建jQuery对象时，诸如的标签body可能会被剥离。发生这种情况的原因是，为了创建对象，实际上将HTML标记插入了DOM，而该DOM不允许此类附加标签。

文档中的相关报价：

如果将字符串作为参数传递给$（），则jQuery会检查该字符串以查看它是否看起来像HTML。

[...]如果HTML比不带属性的单个标签复杂，如上面的示例所示，则元素的实际创建由浏览器的innerHTML机制处理。在大多数情况下，jQuery创建一个新元素并将该元素的innerHTML属性设置为传入的HTML代码段。当参数具有单个标签（带有可选的关闭标签或快速关闭标签）时— $（“ <img / >“）或$（” <img>“），$（” <a> </ a>“）或$（” <a>“）— jQuery使用本机JavaScript createElement（）函数创建元素。

传递复杂的HTML时，某些浏览器可能不会生成完全复制提供的HTML源代码的DOM。如前所述，jQuery使用浏览器的.innerHTML属性来解析传递的HTML并将其插入到当前文档中。在此过程中，某些浏览器会过滤掉某些元素，例如<html>，<title>或<head>元素结果，插入的元素可能不代表所传递的原始字符串。

我最终得到了一个简单的解决方案：

var body = data.substring(data.indexOf("<body>")+6,data.indexOf("</body>"));
$('body').html(body);

也可以与head或任何其他标签一起使用。

（使用xml解析的解决方案会更好，但如果XML响应无效，则必须执行一些“字符串解析”。）

我做了一些实验，并确定了原因，因此，在我感兴趣的一个真实答案之前，这里有一个帮助理解问题的技巧。

$.get('/',function(d){
    // replace the `HTML` tags with `NOTHTML` tags
    // and the `BODY` tags with `NOTBODY` tags
    d = d.replace(/(<\/?)html( .+?)?>/gi,'$1NOTHTML$2>',d)
    d = d.replace(/(<\/?)body( .+?)?>/gi,'$1NOTBODY$2>',d)
    // select the `notbody` tag and log for testing
    console.log($(d).find('notbody').html())
})

编辑：进一步的实验

似乎有可能将内容加载到iframe中，然后可以通过dom对象层次结构访问框架内容。

// get a page using AJAX
$.get('/',function(d){

    // create a temporary `iframe`, make it hidden, and attach to the DOM
    var frame = $('<iframe id="frame" src="/" style="display: none;"></iframe>').appendTo('body')

    // check that the frame has loaded content
    $(frame).load(function(){

        // grab the HTML from the body, using the raw DOM node (frame[0])
        // and more specifically, it's `contentDocument` property
        var html = $('body',frame[0].contentDocument).html()

        // check the HTML
        console.log(html)

        // remove the temporary iframe
        $("#frame").remove()

    })
})

编辑：更多研究

似乎contentDocument是获取window.documentiFrame元素的符合标准的方法，但是IE当然并不真正关心标准，因此这就是如何以window.document.body跨平台的方式获取对iFrame对象的引用。。

var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
var iframeBody = iframeDoc.body;
// or for extra caution, to support even more obsolete browsers
// var iframeBody = iframeDoc.getElementsByTagName("body")[0]

请参阅：用于iframe的contentDocument

我想出了一些奇妙的东西（我认为！）

有您的HTML作为字符串吗？

var results = //probably an ajax response

这是一个jquery对象，其工作原理与当前附加到DOM的元素完全相同：

var superConvenient = $($.parseXML(response)).children('html');

什么都不会剥夺superConvenient！您可以做类似superConvenient.find('body')甚至

superConvenient.find('head > script');

superConvenient 就像每个人都习惯的jquery元素一样工作！！！！

注意

在这种情况下，字符串results必须是有效的XML，因为它将被馈送到JQuery的parseXML方法中。HTML响应的共同特征可能是<!DOCTYPE>标签，从这个意义上来说，该标签会使文档无效。<!DOCTYPE>使用此方法之前，可能需要去除标签！还要注意诸如标记之类的功能，但不要关闭标记，例如：

<ul>
    <li>content...
    <li>content...
    <li>content...
</ul>

...以及HTML的其他任何功能，这些功能都会被浏览器轻松地解释，但会使XML解析器崩溃。

适用于我的正则表达式解决方案：

var head = res.match(/<head.*?>.*?<\/head.*?>/s);
var body = res.match(/<body.*?>.*?<\/body.*?>/s);

详细说明：https : //regex101.com/r/kFkNeII/1

本文地址：http://jquery.askforanswer.com/zaiajax-htmlxiangyingzhongchazhaobodybiaoqian.html
文章标签：ajax , document-body , javascript , jquery
版权声明：本文为原创文章，版权归 admin 所有，欢迎分享本文，转载请保留出处！

在ajax HTML响应中查找body标签

编辑：进一步的实验

编辑：更多研究

注意

文件下载