How to get the body element form the jQuery.load() response?
HTML:
<html>
<head>
<title></title>
</head>
<body>
<div class="mainContainer"> dgdhgdhgd
<div class="header"></div>
<div class="navigation"></div>
<div class="content"></div>
<div class="footer"></div>
</div>
</body>
</html>
jQue开发者_JAVA技巧ry:
<script type="text/javascript">
$(function() {
alert("hsahdjkha");
$('#form1').append('<span id="result" ></span>');
$('#result').load('sageframetemplating/layout.html', function() {
alert('Load was performed.');
$('#result').find('body').html();
alert($('#result').html());
test();
});
});
function test() {
$.ajax({
type: "POST",
url: "Default.aspx/Result",
data: "{ result:'" + $('#result').html() + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(response) {
alert("Wa hooooooooo");
},
error: function() {
alert("error");
}
});
}
</script>
I want to catch only body part of the HTML
but I get:
<title></title>
<div class="mainContainer"> dgdhgdhgd
<div class="header"></div>
<div class="navigation"></div>
<div class="content"></div>
<div class="footer"></div>
</div>
How it possible to catch only body part?
The problem is you are trying to insert a block of HTML containing a <body>
and a <head>
tag into the page.
Since you can't have multiple <body>
tags within the page, they get stripped out, leaving you with the output you see.
One possible solution is to use $.get() instead -- which doesn't dump the data straight into the page -- and parse the data before putting it into the page.
$.get('sageframetemplating/layout.html', function(data) {
var parsedData = $(data).find("body").html();
$("#result").html(parsedData);
});
I'll admit I wrote this without any testing on my end, so you may have to clean up the syntax yourself.
EDIT
From html()
docs:
This method is not available on XML documents.
Terrific.
The data
object is really a Document
object, which has a method getElementsByTagName()
which allows us to hack around with it and get our hands on a NodeList
. If we then access the first item in the list, we get a Node
:
var node = data.getElementsByTagName("body")[0]
At this point we can extract the results:
$("#result").append($(node).children())
This dirty, dirty hack will get you what you want for this very specific scenario.
Note can do horrible things if your page contains scripts.
精彩评论