Dev. Web/JavaScript Jquery
[jQuery] 속성, 속성 추가 제거 (attr, removeAttr) 서방님
devock
2016. 7. 30. 15:05
- 해당 속성 이름의 값을 return 한다.
예)
$(document).ready(function(){
$("#test_id").click(function(){
var title = $("#a").attr("title");
$("#b").text(title);
});
});
- test_id 라는 id를 가진 요소를 클릭하면 a라는 id를 가진 요소의 title 속성을 b라는 id를 가진 요소에 작성된다.
- 해당 요소의 속성(attributeName)의 값을 변경시킨다.
예)
$(document).ready(function(){
$("#test_id").click(function(){
$("#a").attr("src", "img/test.gif");
});
});
- test_id라는 id를 가진 요소를 클릭하면 a라는 id를 가진 요소의 src경로를 img/test.gif로 변경한다.
- 해당 요소의 속성(attributeName)의 값을 function으로 변경시킨다.
예)
$(document).ready(function(){
$("#test_id").click(function(){
$("#a").attr("src", function(){
return "img" + this.title + ".gif";
});
});
});
- test_id라는 id를 가진 요소를 클릭하면 a라는 id를 가진 요소의 src경로를 img/ + 해당속성의 title + .gif 경로로 변경시킨다.
- 해당 요소에 여러 속성을 변경한다.
예)
$(document).ready(function(){
$("#test_id").click(function(){
$("#a").attr({
src : "img/test.gif",
title : "test",
alt : "test"
});
});
});
- test_id라는 id를 가진 요소를 클릭하면 a라는 id를 가진 요소의 src경로를 img/test.gif로 title과 alt는 test로 변경한다.
- 해당 요소의 속성(attributeName)을 제거한다.
예)
$(document).ready(function(){
$("#test_id).click(function(){
$("#a").removeAttr("disabled");
});
});
- test_id라는 id를 가진 요소를 클릭하면 a라는 id를 가진 요소의 disabled속성을 제거한다.