AJAX 원생 js 및 Jquery 해석 html, xml, txt, json 형식 텍스트
원생 js 분석 HTM 파일, txt 파일
ajax/ajax1.js
window.onload = function() {
//1. a onclick
document.getElementsByTagName('a')[0].onclick = function() {
// 2. XMLHttpRequest
var xmlHttp = null;
if (window.XMLHttpRequest) {
//IE6 ，google，
xmlHttp = new XMLHttpRequest();
} else {
// IE5
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//3. url:
var url = this.href+"?time="+new Date() ;//
var method = "post" ;//post
//4. XMLHttpRequest open
xmlHttp.open(method,url) ;
//post
xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); ;
//5. XMLHttpRequest
xmlHttp.send("name='sdfs'") ;
//6.XMLHttRequest onreadystatechange
xmlHttp.onreadystatechange = function(){
alert(xmlHttp.readyState) ;
if(xmlHttp.readyState==4){//xmlHttp.readyState 4
if(xmlHttp.status == 200){//
document.getElementsByTagName('a')[0].innerHTML
= xmlHttp.responseText ;//
}
}
}
// a onclick
return false ;
}
}text/ajax1.html
<a href="aaa.html">hello worlda>ajax1.jsp
<script type="text/javascript" src="ajax/ajax1.js" charset="UTF-8">script>
head>
<body>
<a href="text/ajax1.html">ajax1a>
body>효과 보이 기
<a href="text/ajax1.html"><a href="aaa.html">hello worlda>a>jquery 분석 HTML 파일, txt 파일
ajax_jqurey/ajax-html-jquery.js
$(function(){
$('a').click(function(){
var url = this.href+" a" ;// a
var args = {"time":new Date()} ;// (JSON )
$("#h3").load(url,args) ;//load id = h3
return false ;// a
});
})ajax-html-jquery.jsp
<a href="text/ajax-html-jquery.html">ajax-html-jquerya>
<a href="text/ajax-html-jquery2.html">ajax-html-jquery2a>
<h3 id="h3">h3>
text/ajax-html-jquery.html
<h2><a href="#"> aa>h2>
<span>sdadjkspan>
<a>pppa>원생 js 해석 xml
ajax/ajax2.js
window.onload = function() {
var aNodes = document.getElementsByTagName('a');// a
for (i = 0; i < aNodes.length; i++) {
aNodes[i].onclick = function() {// a onclick
var request = new XMLHttpRequest();// XMLHttpRequest
var method = "GET";//
var url = this.href + "?time=" + new Date();//
request.open(method, url);// open()
request.send(null);// send()
request.onreadystatechange = function() {// onreadystatechange readyState
alert(request.readyState);// readyState
if (request.readyState == 4) {//
if (request.status == 200 || request.status == 304) {//
var xml = request.responseXML;// xml
// xml
var name = xml.getElementsByTagName('name')[0].firstChild.nodeValue;// xml name
var age = xml.getElementsByTagName('age')[0].firstChild.nodeValue;
var garde = xml.getElementsByTagName('garde')[0].firstChild.nodeValue;
var specialty = xml.getElementsByTagName('specialty')[0].firstChild.nodeValue;
// alert(name);//
// alert(age);
// alert(garde);
// alert(specialty);
var ul = document.createElement('ul');// ul
var li1 = document.createElement('li');// li
var li2 = document.createElement('li');
var li3 = document.createElement('li');
var li4 = document.createElement('li');
li1.appendChild(document.createTextNode(name)); name li1
li2.appendChild(document.createTextNode(age));
li3.appendChild(document.createTextNode(garde));
li4.appendChild(document.createTextNode(specialty));
var div1 = document.getElementById('div1');// di=div1
div1.innerHTML = "";// div
ul.appendChild(li1);// li ul
ul.appendChild(li2);
ul.appendChild(li3);
ul.appendChild(li4);
div1.appendChild(ul); ul div1
}
}
}
return false;// a onclick
}
}
}ajax2.jsp
text/1.xml">xml 1a>
<a href="text/2.xml">xml 2a>
<div id="div1">div>text/1.xml
<person>
<name> name>
<age>20age>
<garde> garde>
<specialty> specialty>
person>text/2.xml
<person>
<name> name>
<age>10age>
<garde> garde>
<specialty> specialty>
person>jquery 해석 xml ajaxjqurey/ajax-xml-jquery.js
$(function(){
$('a').click(function(){
var url = this.href ;
var args = {"time":new Date()} ;
//post get post
//function: data
$.get(url,args,function(data){
var name = $(data).find("name").text() ;// data jqurery find() text() name
var age = $(data).find("age").text() ;
var garde = $(data).find("garde").text() ;
var specialty = $(data).find("specialty").text() ;
$("#h3").empty().append(""+name+""+garde+"").append("age:"+age+"").append(""+specialty+"") ;
}) ;
return false ;
});
})ajax2.jsp
<a href="text/1.xml">xml 1a>
<a href="text/2.xml">xml 2a>
<div id="div1">div>text/1.xml
<person>
<name> name>
<age>20age>
<garde> garde>
<specialty> specialty>
person>text/2.xml
<person>
<name> name>
<age>10age>
<garde> garde>
<specialty> specialty>
person>원생 js 해석 json ajax / json. js
window.onload = function() {
var aNodes = document.getElementsByTagName('a');
for (var i = 0; i < aNodes.length; i++) {
aNodes[i].onclick = function() {
var xmlHttp = new XMLHttpRequest();
var method = "GET";
var url = this.href + "?time=" + new Date();
xmlHttp.open(method, url);
xmlHttp.send(null);
xmlHttp.onreadystatechange = function() {
alert(xmlHttp.readyState);
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
alert(0) ;
var jsonObject = xmlHttp.responseText;// responseText
var jsonText = eval("(" + jsonObject + ")");// json
var name = jsonText.person.name;
var age = jsonText.person.age ;
var garde = jsonText.person.garde;
var specialty = jsonText.person.specialty;
var ul = document.createElement('ul');
var li1 = document.createElement('li');
var li2 = document.createElement('li');
var li3 = document.createElement('li');
var li4 = document.createElement('li');
li1.appendChild(document.createTextNode(name));
li2.appendChild(document.createTextNode(age));
li3.appendChild(document.createTextNode(garde));
li4.appendChild(document.createTextNode(specialty));
var div1 = document.getElementById('div1');
div1.innerHTML = "";
ul.appendChild(li1);
ul.appendChild(li2);
ul.appendChild(li3);
ul.appendChild(li4);
div1.appendChild(ul);
}
}
}
return false;
}
}
}text/json1.json
{"person":{
"name":" ",
"age":10,
"garde":" ",
"specialty" :" "
}
}
text/json2.txt
{"person":{
"name":" ",
"age":16,
"garde":" " ,
"specialty":" "
}
}json.jsp
<a href="text/json1.json">json1.jsona>
<a href="text/json2.txt">json.txta>
<div id="div1">div>jquery 해석 json
ajax_jqurey/ajax-json-jquery.js
$(function(){
$('a').click(function(){
var url = this.href ;
var args = {"time":new Date()} ;
//post get post
//function: data
$.getJSON(url,args,function(data){// data json
var name = data.person.name ;
var age = data.person.age ;
var garde =data.person.garde ;
var specialty = data.person.specialty ;
$("#h3").empty().append(""+name+""+garde+"").append("age:"+age+"").append(""+specialty+"") ;
}) ;// get getJson },"JSON") ;
return false ;
});
})text/json1.json
{"person":{
"name":" ",
"age":10,
"garde":" ",
"specialty" :" "
}
}text/json2.txt
{"person":{
"name":" ",
"age":16,
"garde":" " ,
"specialty":" "
}
}json.jsp
<a href="text/json1.json">json1.jsona>
<a href="text/json2.txt">json.txta>
<div id="div1">div>황소 야, 묵묵히 보지 마라.빨리 접속 해서 댓 글 달 아 주세요! * ^o^*
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
JSP| EL (Experession Language)텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
