A> attr -- 어트리뷰트 가져오기 , 수정하기
--여기서 요소란 alt, value 같은 property들
attr('요소') -- 요소의 값 가져오기
attr('요소','바꿀 값') --요소의 값을 '바꿀 값'으로 수정
attr('요소','객체') --요소의 값을 객체를 읽어서 반영
attr('요소',function() ) --요소의 값을 function을 통해 반영
--예시
1
2
3
|
$("img").attr("src", function() {
return "../images/" + this.title;
});
|
cs |
2라인의 this는 img태그를 가리킨다.
--어트리뷰트 제거하기는
removeAttr 로 한다.
B> addClass --class 추가하기
--예시
1
|
$('span').addClass('redtext');
|
cs |
이런것도 된다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
$(function() {
$("button").click(function() {
$("li").addClass(function(index, currentClass) {
var addedClass;
if (currentClass === "red") {
addedClass = "green";
$("p").text(index + "번째 항목에 그린 배경색이 생김" );
}else{
addedClass = "yellow";
}
return addedClass;
});
});
});
|
cs |
3라인의 index는 li의 인덱스값이다. 몇번째인지의 정보이다.
currenClass는 index에 해당하는 번째의 li 태그의 현재 클래스 정보이다.
즉 현재 클래스가 red 인 태그의 클래스를 green 으로 바꾼것이다.
만약 그렇지 않다면 클래스를 yellow로 한다.
--클래스 지우기는
removeClass 로 한다.
C> toggleClass()
toggleClass('클래스) --클래스가 있으면 추가 없으면 제거
D> hasClass()
hasClass('클래스') --클래스가 있으면 ture 없으면 false
E> .html() --태그 안의 내용을 가져오거나, 값을 수정하기
1. $(this).html() 과 같이 쓰인다.
innerHTML 과 같은 역할을 한다.
2. $('태그').html(넣을 내용)
'언어 > javascript' 카테고리의 다른 글
jQuery4 --DOM 조작하기 (0) | 2021.02.17 |
---|---|
jQuery3 --DOM 탐색 (0) | 2021.02.16 |
jQuery2 - 필터( filter) (0) | 2021.02.16 |
jquery1 --기본 선택자 (0) | 2021.02.15 |
javascipt - 웹 워커(web worker) (0) | 2021.02.15 |