[JQuery] css(), attr(), prop()

 

Jquery 

 

• jquery는 자바스크립트 이벤트 기반 라이브러리이다.
• 현재 페이지의 로딩이 완료되면 ready 이벤트가 발생한다.
  ->ready 이벤트 발생 시 처리 함수 생성해줌
• jquery는 가장 마지막에 실행된다.

 

 

 html

<input type="text" id="txt"/>
<h1>제이쿼리에서 html 사용하기</h1>
<h2 class="c1">제이쿼리 테스트</h2>
<h2 class="c1">제이쿼리 테스트</h2>
<img src="../img/제목 없음.png"/>

 

 

jquery 작성법

jQuery(document).ready(function(){console.log("jquery start....")});​

$(document).ready(function(){console.log("jqeury start....)});

$(function(){console.log("jquery start....");});

 

 

 

---

css()

: jquery에서 css 적용하기

 

$(function(){
		//제이쿼리에서 css 사용하기
		//내장객체, 태그, 아이디, 클래스
		//css(속성, 속성값)
		$("h1").css("color","blue").css("background-color","lightblue")
				.css("font-family", "궁서체");
		$(".c1").css("background-color", "pink");
})

 

$("h1").css("color","blue").css("background-color","lightblue");

.css로 연결해서 사용 가능, 줄 바꿈 한 뒤 사용 가능

 

 

---

attr()

: html 속성(attribute) 사용 함수

 

<input type="text" id="txt"/>

$("#txt").attr("type", "password");})

jquery에서 attr 함수를 이용해 text type을 password type으로 변경할 수 있다.

 

타입이 변경됨

---

prop()

: html 속성 중 속성명만으로 처리되는 속성을 사용

$("#txt").prop("readonly", true);