jquery 동적 js 실행

jQuery 2012. 1. 10. 17:40

-------------------------------

// JSON 데이터

var tableData = [

    { "Num": "1", "Name": "홍길동", "Title": "안녕" },

    { "Num": "2", "Name": "백두산", "Title": "방가" },

    { "Num": "3", "Name": "임꺽정", "Title": "또봐" }

];

 

var htmls = '';

 

htmls += "<table border='1'>"

htmls += "<tr><th>번호</th><th>이름</th><th>제목</th></tr>";

$.each(tableData, function() {

    htmls += "<tr>";

    htmls += "<td>" + this['Num'] + "</td>";

    htmls += "<td>" + this['Name'] + "</td>";

    htmls += "<td>" + this['Title'] + "</td>";

    htmls += "</tr>";

});

 

htmls += "</table>";

 

$('#ctlGrid').html(htmls); // ctlGrid 포함될 HTML 있는 레이어

==================================

03.JQuery.getScript.htm

-----------------------------------

<!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>

    <title>하나의 완성된 자바스크립트 파일을 동적 로드/실행</title>

    <script src="../Js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function() {

            $("#btn").click(function() {

                // 아래 코드가 실행되는 시점에 js 파일의 기능 실행됨

                $.getScript('03.jQuery.getScript.js');

            });

        });

    </script>

</head>

<body>

<input type="button" id="btn" value="표그리기" />

<div id="ctlGrid">

</div>

</body>

</html>

'jQuery' 카테고리의 다른 글

jQuery 스크롤 올리기  (0) 2012.02.07
XML HTML로 로드 하기  (0) 2012.01.10
jQuery json load  (0) 2012.01.10
jquery 정리  (0) 2011.12.26
아주쉬운 jQuery & jQuery Ajax  (0) 2011.10.11
블로그 이미지

스마트전

,