>  기사  >  웹 프론트엔드  >  Jquery.load_jquery로 페이지를 로드한 후 페이지 혼란에 대한 해결 방법

Jquery.load_jquery로 페이지를 로드한 후 페이지 혼란에 대한 해결 방법

WBOY
WBOY원래의
2016-05-16 16:33:131745검색

처음에는 Jquery를 이해하지 못했기 때문에 항상 jquery.load 메서드를 사용하여 부분 새로 고침을 달성하기 위해 새 페이지를 로드하고 싶었습니다. 로드된 페이지가 원래의 별도 페이지와 다르고, 스타일이 없어졌어요. 나중에 인터넷에서 찾아보니 다른 분의 답변이더군요.

그렇습니다. 일부 콘텐츠를 필터링하지 않고 직접 로드하면 페이지가 혼란스러워집니다. 예를 들어, 로드한 후에는 6c04bd5ca3fcae76e30b72ad730ca86d 한 페이지의 body> 태그는 표준 HTML이 아닙니다. 이는 jquery.load() 함수에 지정됩니다. 일반적으로 로드된 페이지는 로드된 콘텐츠의 요소에 따라 CSS 스타일을 재정의하고 js 이벤트를 추가해야 합니다. 예:

원본 페이지 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>

원본 페이지 A.html에 호출된 jquery.load()를 로드한 다음 원본 페이지에서 page-li 스타일을 재정의합니다.

load(), 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>

도움이 되었기를 바랍니다

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.