JQuery 구문 분석 HTML, JSON 및 XML에 대한 자세한 설명 example_jquery

WBOY
풀어 주다: 2016-05-16 16:53:58
원래의
1263명이 탐색했습니다.

1. HTML

때때로 HTML 조각이 HTML 파일에 저장되고 HTML 파일을 다른 메인 페이지에서 직접 읽은 다음 내부의 HTML 코드 조각이 구문 분석되어 메인 페이지에 통합됩니다.

fragment.html 파일 내용:

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

< ;div>hello Jquery

메인 페이지의 코드를 파싱합니다.
Test.html

코드를 복사합니다 코드는 다음과 같습니다. 🎜>
$("#a1").click(function(){
$("#div2").load('fragment.html');
false 반환;
});[ 코드]

2. JSON
JSON 파일은 test.json이며 내용은
[코드]
[{"name":"jim","age":"입니다. 20 "},{"name":"lily","age":"18","hobby":["swim","movie"]}]

메인 페이지의 코드를 파싱합니다.

Test.html

코드를 복사합니다 코드는 다음과 같습니다. 🎜>
$("#a2").click(function(){
$.getJSON('test.json',function(data){
var html = '                                                                                                                        td>'
                                 ​) {
html = 줄 ","
                                  html = ''
}); '';                                                                                                 


3. XML

XML 파일은 test.xml이고 내용은 다음과 같습니다.




코드 복사


코드는 다음과 같습니다.

 
<루트> 
     
        深入浅出extjs 
        张三 
        88 
   
 
     
        锋利的jQuery 
        이사 
        <가격>99 
   
 
     
        深入浅流flex 
        王五 
        108 
   
 
     
        java编程思想 
        钱七 
        128 
   
 
 

주요면
Test.html中解析代码
复代码 代码如下:

$("#a3").click(function(){ 
        $.get('test.xml',function(data){ 
            var s="";
            $(data).find('book').each(function(i){ 
               var id=$(this).attr('id'); 
               var name=$(this) .children('name').text(); 
               var 작성자=$(this).children('author').text(); 
              var 가격=$(this).children('price' ).text(); 
               s =id "    " 이름 "    " 작성자 "    " 가격 "
"; 
          }); 
           $('#div2').html(s);
        });
    }); 

对JQuery解析不同文档做了一个Demo,Test.html적의 原码是
复主代码 代码如下:

 
 
    <제목> 
     
     
   
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿