CODEWITHSUNDEEP
jqueryajax
Nrc
Nrc

Reputation: 9797

Load the content of a div with ajax

With jQuery ajax I can load in a div a div of another page. My question is: can I load the content of a div, but not the div itself?. In this case, can I load "Some text" and #intern but not #extern ?

One solution is to load one on one each element inside #extern. But this is a simplified case and in the real case, there are a lot of things and makes this option not very convenient.

JQUERY AJAX:

$("#target").load("extern.html #extern");

INDEX.html:

<div id="target"></div>

EXTERN.html:

<div id="extern">
  Some text
  <div id="intern"></div>
</div>

Upvotes: 0

Views: 84

Answers (2)

Nrc
Nrc

Reputation: 9797

After trying a lot of things I could find the answer:

$("#target").load("3-extern.html #extern" // I load the div and the content first
,function(){ $("#intern").unwrap(); } // I eliminate the loaded div that I do not need anymore
);

Upvotes: 0

Dave
Dave

Reputation: 10924

You can use jQuery.get() in combination with .replaceWith() to achieve the desired result:

$.get("extern.html").done(function(data) {
  $("#target").replaceWith(data);
});

Upvotes: 1

Related Questions