Jquery load HTML file but exclude some tags

Hi,

I want to load (ie: embed) a HTML file into a DIV however I need to exclude some tags and divs. For example I do not want to load the <div id="nav">. I only have javascript/jquery available. (I cannot use any server side scripting).

I can use Jquery .load function to load an entire HTML page into a div, but I only want to load some parts. Is this possible?

<script type="text/javascript">
$(function()
{
        $("#myModal").load("modal.html");
});
</script>

Open in new window


Thanks for any input

EDIT: I changed the question slightly.
mhdiAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Tom BeckCommented:
You can do something like this with jquery ajax however older versions of IE may be problematic. #container is the selector of the element you want to load from the other page.

$("#myModal").load("modal.html #container');

Documentation:

http://api.jquery.com/load/
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
mhdiAuthor Commented:
That seems to work, however I need to load 2 or 3 elements from the page.

eg: <script> elements in the head, #container1 and #containter2

Is this possible?
0
Tom BeckCommented:
You could put your scripts in the containers and giv the containers a class.

$("#myModal").load("modal.html .container");
0
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

mhdiAuthor Commented:
I cant modify the source page unfortunatley.

What if I used get() somehow? Then I could remove elements using .remove()?

Im trying to get this to work now but its not working yet.

$.get("trace.html"),function(data){
  $(#removethis).remove();
  $("#output").html(data);
}

Open in new window

0
Tom BeckCommented:
Progress? I somehow missed your latest post.
0
mhdiAuthor Commented:
Not really.

My page I am importing into has the same Div ID's as the source page. So I am having trouble removing the unwanted divs.

I will have a look at this again soon and post back.
0
Tom BeckCommented:
How about using an iFrame? That would eliminate the id overlap problem. You can isolate portions of a web page in an iFrame.

Similar situation here:

http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/CSS/Q_27919650.html#a38552510
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
jQuery

From novice to tech pro — start learning today.