1. 아이디 선택자와 클래스 선택자
- .은 클래스 선택자
- #은 아이디 선택자
<html>
<head>
<meta charset="UTF-8">
<script src="http://code.jquery.com/jquery-1.10.2.js" ></script>
<script>
$(document).ready(function(){
$('h1,b').css('color','red');
$('#target').css('color','orange');
$('.item').css('color','blue');
});
</script></head>
<body>
<h1 id="target"> 선택자 시험중 </h1>
<h2 class="item"> 선택자 시험중 </h2>
<h2 class="item"> 선택자 시험중 </h2>
</body>
</html>
2. input 태그에 value 넣기
<html>
<head>
<meta charset="UTF-8">
<script src="http://code.jquery.com/jquery-1.10.2.js" ></script>
<script>
$(document).ready(function(){
$('input[type=text]').val("Hello");
});
</script></head>
<body>
<input type="text" name="id1"><br>
<input type="text" name="id2">
</body>
</html>
<html>
<head>
<meta charset="UTF-8">
<script src="http://code.jquery.com/jquery-1.10.2.js" ></script>
<script>
$(document).ready(function(){
$('input[name="id2"]').val("Hello");
});
</script></head>
<body>
<input type="text" name="id1"><br>
<input type="text" name="id2">
</body>
</html>3. (문서객체조작) - 이미지 클릭할때마다 속성 지우기
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>
$(function(){
$('img').attr('width', 200);
$('img').each(function(index, item) {
var src = $(item).attr('src');
alert(src);
$(this).removeAttr('width');
});
});
</script>
</head>
<body>
<img src=./img/home.png />
<img src=./img/like.png />
<img src=./img/main.jpg />
</html>
ᴘᴇᴛɪᴛs ᴅᴇ́ᴠᴇʟᴏᴘᴘᴇᴜʀ. ᴘʀᴏɢʀᴀᴍᴍᴀᴛɪᴏɴ = ᴘʟᴀɪsɪʀ 💕