$ .ajax()只获取正文

时间:2010-10-05 06:35:30

标签: jquery html ajax

我有这样的剧本

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Testing Ajax</title>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<a class="test" href="getthis.php">click here</a>
<div class="get"></div>

<script type="text/javascript">
    $('.test').click(function(event){
        event.preventDefault();
        var a = $('body');
        $.ajax({
            url: "/getthis.php",
            dataType: 'text',
            success: function(data){            
                $('.get').append(data.find);
            }
        });
    });
</script>
</body>
</html>

使用此脚本我尝试获取内容getthis.php

getthis.php仅包含此

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title></title>
    </head>
    <body>
        Olalalalala bebe
    </body>
    </html>

当我这样做时,我得到结果getthis.php的完整html

我怎样才能获得身体内容? 这只是意思。 “Olalalalala bebe”

有人可以给我解释吗?

...谢谢

6 个答案:

答案 0 :(得分:7)

使用http://api.jquery.com/load/您可以加载特定的网页片段

答案 1 :(得分:5)

非常简单。用另外一层DIV包裹BODY内部会:

$.get(url, {}, function(data){
  var data = data.replace('<body', '<body><div id="body"').replace('</body>','</div></body>');
  var body = $(data).filter('#body');
  //... do what you want with body ...
});

答案 2 :(得分:3)

想知道这是否有帮助:

$(data).text();

这似乎开箱即用:

$.ajax({
    url: 'http://stackoverflow.com/questions/3861325/ajax-get-body-only/',
    success: function (data) {
        alert($(data).text().replace(/\s+/gm, ' '));
    }
});

答案 3 :(得分:2)

这应该这样做:

$('.get').load('/getthis.php body');

编辑抱歉,我刚刚对此进行了测试,使用body作为选择器似乎不起作用,这让我感到惊讶。如果我将getthis.php更改为:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title></title>
    </head>
    <body>
        <div id="test">
        Olalalalala bebe
        </div>
    </body>
</html>

并称之为:

$('.get').load('/getthis.php #test');

我得到你想要的结果。但似乎body在这种情况下不是有效的选择器。

答案 4 :(得分:0)

如果不需要,您可以从getthis.php中排除html标记,并在页面上显示要显示的数据。

答案 5 :(得分:0)

$.ajax({
    url: "some.html",
    type: "get",
    dataType: 'html',
    success: function(data) {
        $('#here').html(data);
        $('#here').children('meta,link,title,style').remove();
    },
});