요새 prototype.js 를 이용해, javascript 를 깔끔하게, 효율적으로
만드는 방안으로 생각 하고 있는 도중, JQuery 를 알게 되었다.
그런데 이게, JQuery 예제를 이용하던 도중 이것을 이용하면,
디자이너가 HTML를 넘기면 id 및 name 를 세팅하여, 넘겨주면,
스크립트 작업 후 개발을 할때, 디자인이 수정되어도, 가공된 페이지에 변경 없이 작업을 할수 가 있다고 생각이
들었다. Greate!!
물론 prototype 를 이용해 할수도 있는데 흠.. JQuery 를 이용하면 좀더 효율 적으로 할 수 있다.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
<title>Untitled Document</title><script type="text/javascript" src="script/jquery-1.2.6.js"></script>
<script type="text/javascript">$(document).ready(
function (){
$("#textcubeLink").click(
function(){
alert("empas image click");
}
).css("cursor", "pointer");
$("#blogLink").click(
function(){
location.href = "http://taesuz.net/tt/";
}
).css("cursor", "pointer");
}
);</script>
<style type="text/css">
.links { cursor: pointer; }
</style></head>
<body>
<a id="blogLink">taesuz.net 링크</a>
<br />
<br />
<img src="http://taesuz.net/tt/skin/ReinerSchwarzKoreanisch/images/textcube.jpg" id="textcubeLink" /></body>
</html>
보시다 시피, 분리가 될수 있다. html 디자인은 그대로 있지만, 링크나, 스크립트 제어 부분이 완전히 분리되어있다.
좀더 공부 하면, 보다 깔금하게 효율적으로 분리가 되어 제어 가능하지 않을까?
이 얼마나 알흠다운가 ㅎㅎ
앞으로 효율적으로 활용해 봐야겠다.
'프로그래밍 > HTML _ CSS _ JavaScript' 카테고리의 다른 글
| JQuery 사용팁 모음. (1) | 2009.06.17 |
|---|---|
| Javascript Object Table (0) | 2009.03.18 |
| 팝업창에서 부모 창으로 포커스(Internet Explorer, FireFox) (1) | 2008.11.10 |
| 팝업 같은 레이어 만들기. (투명 레이어 효과) (0) | 2008.07.04 |
| JSEclipse로 자바스크립트 애플리케이션 작성하기 (한글) (1) | 2008.06.19 |