728x90
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>์์์ํฉ</h1>
<button type="button" id="woman">์ฌ์ฑ๋ถ</button>
<button type="button" id="man">๋จ์ฑ๋ถ</button>
<br><br>
<table border="1">
<tr>
<th>title</th>
<th>name</th>
<th>time</th>
</tr>
<tr>
<th>์ฐ์น</th>
<td></td>
<td></td>
</tr>
<tr>
<th>2์</th>
<td></td>
<td></td>
</tr>
<tr>
<th>3์</th>
<td></td>
<td></td>
</tr>
</table>
<script type="text/javascript">
//2์ฐจ์๋ฐฐ์ด
let woman = [["",""],["๊น์ํฌ","01:06:11"],["์ฑ์ถํฅ","01:17:34"],["๋ฐ์งํฌ","01:23:45"]];
let man = [["",""],["ํ๊ธธ๋","01:16:23"],["์ผ์ง๋งค","01:24:51"],["์ ์๋","01:34:19"]];
$(document).ready(function(){
//$("tr:eq(1) td:eq(2)").html("๋ฐ์ดํฐ");
$("#woman").click(function(){
for(i=0; i<4; i++){
for(j=0; j<2; j++){
$("tr:eq(" + i + ") td:eq(" + j + ")").html(woman[i][j]);
}
}
});
$("#man").click(function(){
for(i=0; i<4; i++){
for(j=0; j<2; j++){
$("tr:eq(" + i + ") td:eq(" + j + ")").html(man[i][j]);
}
}
});
});
</script>
</body>
</html>
'๐ ์๋ฐ ์๋ฒ ํ์ด์ง JSP > ๐ช ์ ์ด ์ฟผ๋ฆฌ jQuery' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
์ ์ด ์ฟผ๋ฆฌ - ์ด๊ธ ๋ฌธ์ /ํ์ด 1๏ธโฃ๐ (0) | 2021.03.08 |
---|---|
5๏ธโฃ ์ ์ด ์ฟผ๋ฆฌ - List , Option + Oppend, Prepend ์ ์ฉ (0) | 2021.03.05 |
3๏ธโฃ ์ ์ด ์ฟผ๋ฆฌ - CSS, MouseOver, ์์ฑ ์ถ๊ฐ (0) | 2021.03.05 |
2๏ธโฃ ์ ์ด ์ฟผ๋ฆฌ - Button ํ๊ทธ ์ ๊ทผ๊ณผ ์๋๋ฒ, + this (0) | 2021.03.05 |
1๏ธโฃ ์ ์ด ์ฟผ๋ฆฌ - ๊ธฐ๋ณธ ๋ฌธ๋ฒ ํ์๊ณผ Getter, Setter (0) | 2021.03.05 |
๋๊ธ