로드해야하는 데이터 로딩에만 집중하는 웹 사이트를 구축합니다. 여기 예제를 작성했으며 wegpage를 빌드하는 좋은 방법인지 알고 싶습니다. 그런 사이트를 구축 할 때 몇 가지 문제가 있습니다 (예 :아약스 기반 웹 페이지 - 좋은 방법?
index.html을
: 그래서 여기 (내용이기 때문에 기본적으로 정말 연결되지 않음)가는
- 즐겨 찾기
- 은 예입니다
<html> <head> <title>Somebodys Website</title> <!-- JavaScript --> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript" src="pagecode.js"></script> </head> <body> <div id="navigation"> <ul> <li><a href="#" class="nav" id="link_Welcome">Welcome</a></li> <li><a href="#" class="nav" id="link_Page1">Page1</a></li> </ul> </div> <div id="content"> </div> </body> </html>
pagecode.js
var http = null; $(document).ready(function() { // create XMLHttpRequest try { http = new XMLHttpRequest(); } catch(e){ try{ http = new ActiveXObject("MS2XML.XMLHTTP"); } catch(e){ http = new ActiveXObject("Microsoft.XMLHTTP"); } } // set navigation click events $('.nav').click(function(e) { loadPage(e); }); }); function loadPage(e){ // e.g. "link_Welcome" becomes "Welcome.html" var page = e.currentTarget.id.slice(5) + ".html"; http.open("POST", page); http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); http.setRequestHeader("Connection", "close"); http.onreadystatechange = function(){changeContent(e);}; http.send(null); } function changeContent(e){ if(http.readyState == 4){ // load page var response = http.responseText; $('#content')[0].innerHTML = response; } }
당신이 볼 수 있듯이 그래서, 탐색 섹션에서 링크의 ID를 기반으로 내용을로드하고있어
<b>Welcome</b> <br /> To this website....
welcome.html 페이지
. 그래서 "Page1"네비게이션 아이템을 링크 가능하게 만들려면, 그 안에 몇 가지 내용이 담긴 "Page1.html"파일을 만들어야합니다.웹 페이지의 데이터를로드하는이 방법이 잘못 되었습니까? 그렇다면 더 좋은 방법은 무엇일까요? 시간에 대한
감사
편집 :
이것은 단지 아주 짧은 예를하고 있었고, 난 (추가로)는 전체 페이지를 제공하는 것은 여전히 가능하다 자바 스크립트를 사용할 수있는 사용자를 위해 그런 말을하고 싶습니다 정적 형태로. 예 :
이 welcome.html 페이지는 기본 index.html 파일의 모든 오버 헤드가 포함됩니다. 이렇게하면 페이지의 버전을 사용하는 아약스는 특별한 기능이 될 것입니다. 그렇지 않습니까?<li><a href="static/Welcome.html" class="nav" id="link_Welcome">Welcome</a></li>
간단히 말해서, Ajax를 사용하여 전체 웹 사이트를 구축하는 것은 매우 잘못된 일입니다. 전통적인 방법은 여전히 최고입니다;) – Duroth