jquery를 통한 웹문서의 수정

Post on 15-Jun-2015

123 Views

Category:

Technology

6 Downloads

Preview:

Click to see full reader

DESCRIPTION

Jquery를 통한 html 문서 사용법

TRANSCRIPT

Jquery 를 통한 웹문서의 수정

1. Text contents

Text() 메서드 가져오기

$(selector).text( )

1. Text contents

Text() 메서드 수정하기

$(selector).text(“ 수정내용” )

1. Text contents

html () 메서드

Text() 메서드 기능 +<html> 태그 가져오기

1. Text contents

실습( 예제 ch11/notice4)

- 텍스트수정과 태그 추가

1. Text contents

val () 메서드- 사용자가 입력한 값이나 선택한

값을 가져오는 메서드$(selector).val( )

2. attr() 메서드

지정한 속성의 값을 가져오거나 수정 가능

2. attr() 메서드

태그의 속성값 가져오기

$(selector).attr(attribute)

2. attr() 메서드

태그의 속성값 수정하기

$(selector).attr(attribute,value)

2. attr() 메서드

태그의 속성값 수정하기

$(“p”).attr(class,italic-text)

2. attr() 메서드

실습( 예제 ch11/intro2)- 링크를 새창으로 열기

3. class() 메서드

• addClass()- 추가

• removeClass()- 제거

• toggleClass()- 옵션 선택

3. class() 메서드

• addClass()

$(selector).addClass(classname)

3. class() 메서드

• removeClass()

$(selector).removeClass(classname)+addClass(classname)* 추가도 함께 가능

3. class() 메서드

• toggleClass()

$(selector).toggleClass(classname)

3. class() 메서드

실습( 예제 ch11/Sources/tog-

gle.html)- 버튼을 활용한 두가지 화면 옵션

4. css() 메서드

• 웹요소의 css 속성값 수정 가능

• 클래스 + 문서스타일 가져오기 및 수정가능

4. css() 메서드

css 의 속성값 가져오기

$(selector).css(property)eg) $(‘h1’).css(‘font-size’)

4. css() 메서드

css 의 속성값 수정하기$(selector).css(property, value)

eg) $(‘#wrapper’).css(‘width’,500px’)

4. css() 메서드

실습( 예제 ch11/mt-2.html)

- 배경색 , 글자색 전환

top related