|
|
객체 : 김숙희
메소드 : 행동
김숙희야 밥해라
밥해라 -> 메소드
김숙희야 밥해라
밥해라 -> 메소드
이런식으로 객체는 주체 메소드는 동적인 행동이라 생각하면 쉽습니다.
프로그래밍 언어로 생각해 보자면
<div id=name>
$(#name).css(border:0px solid #000000);
$(#name) 은 객체
.css(border:0px solid #000000);은 메소드입니다.
jQuery는 동적으로 제공하기 위하여 DOM API구조를 만들었습니다.
즉 body, head와 같은 태그들을 객체화 했다고 생각하면 됩니다.
|
|
|
속성 값을 지정할 수도 있고 그 값을 나타낼 수 있습니다.
선택된 요소의 속성값을 조회하여 표시하기
예) $(this).attr("name");
// 현재 선택된 요소의 속성값을 표시한다.
선택된 요소의 속성값을 지정하기
$("input[type=text]").attr("name","id")
// input타입이 text인 모든 요소의 Name 속성값을 'id'로 설정
예제)
4lesson1.zip<html>
<head>
<script src="js/jquery-1.12.2.min.js"></script>
<script>
$(document).ready(function()//현재 문서가 준비되면 함수를 사용하겠다.
{
$("input[type=text]").attr("placeholder","입력해주세요");
//input type의 text 요소중 텍스트 기본값이 "입력해주세요"라고 지정됨
//값을 입력하면 "입력해주세요"는 사라짐
});
</script>
</head>
<body>
<form>
<fieldset>
<legend>필수입력사항</legend>
<label>아이디</label><input type=text>
<label>비밀번호</label><input type="password">
</fieldset>
<label>이름 <input type=text></label><br/>
<label>이메일 <input type=text></label><br/>
<label>주소 <input type=text></label><br/>
</form>
</body>
</html>
현재 선택된 요소 제어하기
섡택한 요소를 일일히 제어하려고 하면 코딩하기에는 귀찮을 겁니다.
그래서 주로 사용하는 방법이 this를 활용해서 간단히 제어하는 방법입니다.
예제)
<html>
<head>
<script src="js/jquery-1.12.2.min.js"></script>
<script>
$(document).ready(function()//현재 문서가 준비되면 함수를 사용하겠다.
{
$(".img_1").click(function() {
$(this).slideUp(3000);
});
});
</script>
</head>
<body>
<img src="1.png" class="img_1">
</html>
'웹프로그래밍 > jQuery' 카테고리의 다른 글
| jQuery의 변수 (0) | 2016.03.28 |
|---|---|
| jQuery-DOM요소 제어하기 (0) | 2016.03.28 |
| jQuery-선택자1 (0) | 2016.03.24 |
| jQuery의 개념 및 기초예제 (0) | 2016.03.24 |
| jQuery 설치환경 구성하기 (0) | 2016.03.24 |