>  기사  >  웹 프론트엔드  >  js를 사용하여 동적 웹 사이트_javascript 기술로 서버 측에서 반환된 데이터를 읽습니다.

js를 사용하여 동적 웹 사이트_javascript 기술로 서버 측에서 반환된 데이터를 읽습니다.

WBOY
WBOY원래의
2016-05-16 17:00:571987검색

html에서 js를 사용하여 동적 웹사이트의 서버 측에서 반환된 데이터를 읽어

표시합니다. 1. js.html 페이지

에는 jquery
를 실행하는 js 파일이 필요합니다.

코드 복사 코드는 다음과 같습니다.




새 문서


설명" CONTENT="">


<script> <br><br> $(function(){ <br>//$("#loaddata").click(function(){ <br>$(document).ready(function(){ <br>//읽으려면 getJSON 메서드를 사용하세요. json 데이터, <br>//참고: info.json은 해당 데이터가 json 유형인 한 다양한 유형의 파일일 수 있습니다. <br>$.getJSON('info.json',function(data){ <br><br>var html = ''; <br>$.each(data,function(i,item){ <br>html = '<tr><td>' 항목['name'] '&lt ;/td>' <br>'<td>' 항목['sex'] '</td>' 항목.주소 '</td>' <td>' 항목['home'] ' </td></tr>' <br>}) <br>$('#title').after(html); /after 메소드: 일치하는 각 요소 콘텐츠 뒤에 삽입합니다. <br>}); <br>}); <br><br>//참고: item.address 또는 item['address']일 수 있습니다. <br>//firefox 보고서 "구문 오류 [" json 파일에서 데이터는 로드만 가능합니다<br>//ie chrome은 데이터를 로드할 수 없습니다<br></script>




th>이름주소




info.json 파일




코드 복사

코드는 다음과 같습니다:
[ { "name":"zhangsan", "sex":"man", "address" :"hangzhou",
"home":"http://www.zhangsan.com"
},
{
"name":"lisi",
" sex": "wumen",
"주소":"beijing",
"home":"http://www.lisi.coms"
}
]


적용 시나리오:

데이터베이스에서 정기적으로 읽은 특정 레코드는 표시를 위해 정적 페이지에 배치됩니다. 데이터베이스 액세스에 대한 부담을 줄이기 위해 특정 레코드 수를 꺼내서 json에 저장합니다. 실시간으로 데이터베이스를 요청할 필요가 없습니다.

이제 json의 콘텐츠를 정적 html로 로드할 수 있습니다.
중국어를 표시하지 못하는 것은 그야말로 인코딩 문제입니다. 기본적으로 저장되는 json은 메모장이어야 하고, 접미사는 json으로 변경됩니다. 메모장의 기본 인코딩은 ANSI이므로 당연히 중국어 표시 문제

해결책: .json 파일을 엽니다. - 다른 이름으로 저장하고 아래 인코딩 형식을 확인하고 UTF-8을 선택합니다.

여기에 또 다른 오류가 발생하기 쉬운 곳이 있습니다.
json 파일을 요청하면 405 오류가 보고됩니다. 경로는 분명히 정확하지만 여전히 오류가 보고됩니다.
해결책: 요청을 받도록 요청 방법을 수정합니다.
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
성별홈페이지