HTML 페이지를 AJAX를 통해 검색된 콘텐츠로 바꾸기
일반적인 구조를 가진 HTML 페이지가 있습니다.
<html>
<head>
<script src="..." ></script>
<style>...</style>
</head>
<body>
content
</body>
<script>
var success_callback = function(data) {
// REPLACE PAGE CONTENT & STRUCTURE WITH "data"
}
ajax(url, params, success_callback);
</script>
</html>
여러분은 이런 일이 가능하다고 생각하나요?html 태그에 id를 부여하려고 이미 시도했습니다.$(id).replace(data);성공하지 못하고
이유는 묻지 않습니다만, 이것이 제가 필요로 하는 것입니다(특별한 「매시업 빌더」사이트와 협력하고 있습니다).얘기하자면 길어요.
EDIT : 수신된 콘텐츠의 스크립트를 실행해야 한다는 것을 잊어버렸습니다.외부 스크립트도 다음 명령어를 사용하여 실행할 필요가 있습니다.<script src="...">.
가장 간단한 방법은 다음을 사용하여 새로운 HTML 콘텐츠를 설정하는 것입니다.
document.open();
document.write(newContent);
document.close();
jQuery를 사용하여 다음을 수행합니다.
$('body').load( url,[data],[callback] );
자세한 내용은 문서를 참조하십시오.jquery.com / Ajax / 로드
프로토타입에서 이를 수행하는 방법은 다음과 같습니다.$(id).update(data)
그리고 jQuery:$('#id').replaceWith(data)
그렇지만document.getElementById(id).innerHTML=data작동해야 합니다.
편집: 프로토타입과 jQuery는 자동으로 스크립트를 평가합니다.
해볼 수도 있어
document.getElementById(id).innerHTML = ajax_response
가장 간단한 방법은
$("body").html(data);
그냥 본문 내용을 문서로 바꿀 수는 없나요?시체 취급자요?
페이지가 다음과 같은 경우:
<html>
<body>
blablabla
<script type="text/javascript">
document.body.innerHTML="hi!";
</script>
</body>
</html>
그냥 문서를 사용하세요.차체를 교체합니다.
난 이거면 돼.차체 태그의 모든 내용이 내부로 대체됩니다.지정한 HTML.html 태그와 모든 하위 태그를 변경해야 하는 경우 '문서'의 어떤 태그를 변경할 수 있는지 확인해야 합니다.
javascript 스크립트가 포함된 예:
<html>
<body>
blablabla
<script type="text/javascript">
var changeme = "<button onClick=\"document.bgColor = \'#000000\'\">click</button>";
document.body.innerHTML=changeme;
</script>
</body>
이렇게 하면 새 콘텐츠 내에서 javascript 스크립트를 수행할 수 있습니다.하지만 모든 이중 따옴표와 단일 따옴표를 피하는 것을 잊지 마세요. 그렇지 않으면 효과가 없을 것입니다.javascript에서 이스케이프는 코드를 통과하여 모든 singe와 큰따옴표 앞에 백슬래시를 붙이면 가능합니다.
php와 같은 서버측 스크립팅은 이 방법으로 동작하지 않습니다.PHP는 서버측 스크립팅이므로 페이지를 로드하기 전에 처리해야 합니다.Javascript는 클라이언트 측에서 동작하는 언어이므로 php 코드 재처리를 활성화할 수 없습니다.
jQuery 같은 것을 사용하고 있다고 생각합니다.jQuery를 사용하는 경우 다음 기능이 작동합니다.
<html>
<head>
<script src="jquery.js" type="text/javascript"></script>
</head>
<body>
content
</body>
<script type="text/javascript">
$("body").load(url);
</script>
</html>
언급URL : https://stackoverflow.com/questions/483745/replace-html-page-with-contents-retrieved-via-ajax
'programing' 카테고리의 다른 글
| JSON 파일을 해석하려면 어떻게 해야 하나요? (0) | 2023.03.27 |
|---|---|
| SCRIPT5009: 'JSON'은 정의되어 있지 않습니다. (0) | 2023.03.27 |
| jq를 사용하여 내부 배열의 값을 기준으로 개체 배열을 필터링하려면 어떻게 해야 합니까? (0) | 2023.03.27 |
| Mongoose에서 .populate()로 특정 필드를 반환합니다. (0) | 2023.03.27 |
| MongoDB 문서 필드가 존재하지 않는 경우에만 업데이트하려면 어떻게 해야 합니까? (0) | 2023.03.27 |