http://blog.themeforest.net/tutorials/jquery-for-absolute-beginners-video-series/
에서 재미있는 비디오 강습을 해서 짬짬히 살펴보고 있는 중이다.
가장 많이 사용되고 있는 javascript framework 중 하나이고, asp.net과 가장 같이 잘 사용될 수 있는 javascript framework이기 때문에 더욱더 관심이 가는 내용.
<html>
<head>
<title>This is my first web file</title>
<script type="text/javascript" language="javascript" src="jquery-1.3.1.min.js"></script>
<script type="text/javascript" language="javascript">
function append_table_context() {
$("#tableContext").append("<tr><td>F.Name</td><td>L.Name</td></tr>");
}
</script>
<style type="text/css">
#box
{
background : red;
width : 300px;
height : 400px;
}
</style>
<script type="text/javascript" language="javascript">
$(function() {
$('a').click(function() {
$('#box').fadeOut('fast');
});
});
</script>
</head>
<body>
<div id="box">
<a href="#">Click Me!</a>
</div>
<br/>
<input id="btnInput" type="button" value="click me" onclick="javascript:append_table_context();"/>
<table>
<tr>
<th>First Name</th>
<th>Last Name</th>
</tr>
<tbody id="tableContext">
</tbody>
</table>
</body>
</html>
<head>
<title>This is my first web file</title>
<script type="text/javascript" language="javascript" src="jquery-1.3.1.min.js"></script>
<script type="text/javascript" language="javascript">
function append_table_context() {
$("#tableContext").append("<tr><td>F.Name</td><td>L.Name</td></tr>");
}
</script>
<style type="text/css">
#box
{
background : red;
width : 300px;
height : 400px;
}
</style>
<script type="text/javascript" language="javascript">
$(function() {
$('a').click(function() {
$('#box').fadeOut('fast');
});
});
</script>
</head>
<body>
<div id="box">
<a href="#">Click Me!</a>
</div>
<br/>
<input id="btnInput" type="button" value="click me" onclick="javascript:append_table_context();"/>
<table>
<tr>
<th>First Name</th>
<th>Last Name</th>
</tr>
<tbody id="tableContext">
</tbody>
</table>
</body>
</html>
하나의 박스가 사라지는 내용과 table에 하나씩 추가하는 내용이 있는 소스.