!----------------------------- commFunction.js ------------------------
function createXMLHttpRequest() {
var reqHttp;
if (window.ActiveXObject) { // internet explorer일 경우
try {
reqHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
reqHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e1) {
reqHttp = null;
}
}
} else if (window.XMLHttpRequest){ // internet explorer가 아닐경우
try {
reqHttp = new XMLHttpRequest();
} catch (e) {
reqHttp = null;
}
}
if (reqHttp == null) errorMessage(); //XMLHttpRequest 생성을 실패했을경우
return reqHttp;
}
// 지원할 수 없는 브라우저 사용
function errorMessage() {
alert("XMLHttpRequest를 지원하지 않는 브라우저입니다.");
}
function openServer(method, func, file){
var xmlHttp = createXMLHttpRequest(); //XMLHttpRequest 객체의 생성
xmlHttp.open(method, file, true); //전송방식, URL, 동기 혹은 비동기(true)
xmlHttp.onreadystatechange = function(){ //readyState상태의 변경시 이벤트 발생
if(xmlHttp.readyState == 4){ //서버 데이터 처리가 완료된경우 4
if(xmlHttp.status == 200){ //정상적으로 처리되었을경우 200
func(xmlHttp) //클라이언트에서의 처리
}
}
}
xmlHttp.send(null); //서버에게 데이터 전송. GET방식일 경우 null이다.
}
!---------------------------------- test.html ---------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- httpXMLRequest를 생성하고 콜백함수를 호출하는 commFunction.js를 포함한다. -->
<script src="commFunction.js"></script>
<script>
function printFileInfo(xmlHttp){
var xmlData = xmlHttp.responseXML;
var entertainer = xmlData.getElementsByTagName("entertainer");
for(var i=0; i<entertainer.length; i++)
{
var age = entertainer[i].childNodes[0].childNodes[0].nodeValue;
var name = entertainer[i].childNodes[1].childNodes[0].nodeValue;
insertRow(age, name); //테이블에 row추가
}
}
function insertRow(age, name)
{
var oTable = document.getElementById("resultTable").children[0];
var oRow = document.createElement("tr");
var oCel1 = document.createElement("td");
var oCel2 = document.createElement("td"); //table, tr, td 객체 생성
oRow.style.textAlign='center';
oRow.appendChild(oCel1);
oRow.appendChild(oCel2);
oCel1.innerHTML = age;
oCel2.innerHTML = name;
oTable.appendChild(oRow); //만들어진 row객체 테이블에 추가
}
</script>
</head>
<body>
<input type="button" value="전송" onClick="openServer('GET', printFileInfo, 'oracleJava.xml')" / >
<!--param : 전송방식, 함수명, 파일명-->
<table id="resultTable" border="1">
</table>
</body>
</html>
!-----------------------------------------------------------------------------
바로 아래의 계시글과 같은내용이지만 이처럼 공통으로 사용하는부분을 js파일로 묶어서 정송방식, 함수명, 파일을 파라미터로 주고 사용하면 훨씬 수월합니다. 필요하다면 동기, 비동기방식, post방식일경우 서버로 보낼 데이터도 param으로 추가한 후 사용할수 있습니다.
앞으로의 강좌는 위의 commFunction을 사용하겠습니다.
평일주간[100%환급과정]
(8/04)C#4.0,WinForm,ADO.NET(8/04)자바기초JDBC,Servlet/JSP까지
(8/04)Spring,MyBatis,Hibernate실무과정
(8/11)PL/SQL,ORACLE HINT,TUNING
(8/11)SQL기초에서 Schema Object까지
(8/11)안드로이드개발자과정
(8/11)채용예정교육
평일야간[개인80%환급]
(8/04)웹퍼블리싱 마스터
(8/05)JSP,jQUERY,Spring,MyBatis
(8/06)Spring3.X, MyBatis, Hibernate
(8/08)C#,Network,ADO.NET,ASP.NET
(8/11)SQL기초에서실무까지
(8/11)안드로이드개발자과정
(8/28)자바JSP,jQuery,Spring,MyBatis
주말주간[개인80%환급]
(8/02)Spring3.X, MyBatis, Hibernate
(8/02)C#,ASP.NET마스터
(8/02)웹퍼블리싱 마스터
(8/02)SQL초보에서 Schema Object까지
(8/09)SQL기초에서실무까지
(8/09)안드로이드개발자과정
(8/09)자바JSP,Ajax,jQuery,Spring,MyBatis
(8/23)JAVA,Network&WEB&Framework
주말야간[개인80%환급](18:30~22:20)
(8/02)JAVA,Network&WEB&Framework
댓글 없음:
댓글 쓰기