<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AJAX Asyncronized Javascript And Xml </title>
<script src="./jquery-1.7.2.min.js">
</script>
<script>
$(document).ready(function(){
$('button:eq(1)').click(function(){
$('div').load('jquery14.html');
});
$('button:eq(2)').click(function(){
$.ajax({url:'jquery13.html' ,
dataType:'html',
success:function(data){
$('div').html(data);
}});
return false;
});
// 전체 페이지가 아니라 일부만 가져오고 싶을 때
$('button:eq(3)').click(function(){
$.ajax({url:'jquery13.html' ,
dataType:'html',
success:function(data){
$('div').html($(data).find('table'));
}});
return false;
});
});
</script>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp; //변수 선언
if (window.XMLHttpRequest) // 존재한다면 최신 브라우저에서 지원
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
alert("readyState"+xmlhttp.readyState);
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","http://gusfree.tistory.com",true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>
<button> jquery로 ajax </button>
<button> jquery로 ajax 2</button>
</body>
</html>
chrome에서 구현 되지 않아서 explorer에서 구동~~
'JavaScript > JQuery' 카테고리의 다른 글
| jquery - animation 효과 (0) | 2012.06.19 |
|---|---|
| jquery 여러가지 method2 (0) | 2012.06.18 |
| jquery 여러가지 method (0) | 2012.06.18 |
| jquery - selector (0) | 2012.06.18 |
| jquery - 복습 (0) | 2012.06.18 |