The solution to the page confusion after loading the page with Jquery.load

The solution to the page confusion after loading the page with Jquery.load_jquery

WBOY

Release： 2016-05-16 16:33:13

Original

1774 people have browsed it

Because I didn’t understand Jquery at first, I always wanted to use the jquery.load method to load a new page to achieve partial refresh. It turned out that the loaded page was different from the original separate page, and the style was gone. Later, I found it on the Internet I checked and found the solution. This is someone else’s answer:

That's it. If you don't filter out some content and load it directly, the page will be confused. For example, the new page also has the tag. After loading, there will be two

Original page A.html:

<html>
<head><title></title></head>
<body>
<div id="container"></div>
</body></html>
被load的页面B.html：
<html>
<head><title></title></head>
<style>.page-li {font-size:12px;color:blue}</style>
<body>
<div id="page">
<ol class="page-li">
<li>234123</li><li>341234</li><li>41234</li><li>412de34</li>
</ol>
</div>
</body></html>

Copy after login

Load the called jquery.load() in the original page A.html, and then redefine the style of page-li on the original page:

Added load(), original page of css:

<html>
<head><title></title></head>
<style>.page-li {font-size:12px;color:green}</style>
<body>
<div id="container"></div>
<script type="text/javascript">
$(function(){
$("#container").load("B.html #page",null,function(){alert("加载成功")});
});
</script>
</body></html>

Copy after login

Hope it helps you