>  기사  >  웹 프론트엔드  >  JavaScript는 Ajax를 기반으로 하여 새로 고침 없이 웹 페이지에 파일 콘텐츠를 동적으로 표시합니다.

JavaScript는 Ajax를 기반으로 하여 새로 고침 없이 웹 페이지에 파일 콘텐츠를 동적으로 표시합니다.

亚连
亚连원래의
2018-05-25 11:48:551914검색

이 기사에서는 새로 고침 없이 웹 페이지에 파일 내용을 동적으로 표시하는 Ajax 기반 JavaScript를 주로 소개합니다. 이는 서버에서 txt 파일 내용을 실시간으로 표시하는 기능을 실현할 수 있는 Ajax의 기본 응용 프로그램이며 특정 참조가 있습니다.

이 문서의 예에서는 JavaScript가 Ajax를 기반으로 새로 고침 없이 웹 페이지에 파일 콘텐츠를 동적으로 표시하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.

다음 JS 코드는 가장 기본적인 JS ajax 구현으로, ajax_info.txt 파일의 내용을 서버에서 동적으로 표시할 수 있습니다.

<!DOCTYPE html>
<html>
<head>
<title>sharejs.com</title>
<script>
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
 {// code for IE7+, Firefox, Chrome, Opera, Safari
 xmlhttp=new XMLHttpRequest();
 }
else
 {// code for IE6, IE5
 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
xmlhttp.onreadystatechange=function()
 {
 if (xmlhttp.readyState==4 && xmlhttp.status==200)
  {
  document.getElementById("myp").innerHTML=xmlhttp.responseText;
  }
 }
xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();
}
</script>
</head>
<body>
<p id="myp"><h2>Let AJAX change this text</h2></p>
<button type="button" onclick="loadXMLDoc()">Change Content</button>
</body>
</html>

위 내용은 제가 컴파일한 것입니다. 모두를 위해, 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

Django에서 jquery ajax 게시 데이터를 사용할 때 403 오류에 대한 해결 방법

동적 페이징을 구현하기 위한 ajax +jtemplate에 대한 자세한 설명

요청 프로세스 중에 진행 상황을 표시하는 Ajax 단순 구현

위 내용은 JavaScript는 Ajax를 기반으로 하여 새로 고침 없이 웹 페이지에 파일 콘텐츠를 동적으로 표시합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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