본문 바로가기
IT/javascript

자바스크립트 setAttribute

by 뉴코딩맨 2023. 4. 13.
JavaScript의 setAttribute 메서드는 HTML 요소의 속성 값을 설정할 때 사용됩니다. 이 메서드를 사용하여 지정된 요소의 속성 값을 변경할 수 있습니다.

 

 

사용법

 

setAttribute 메서드는 다음과 같은 구문을 가집니다.
 
element.setAttribute(name, value);
 
여기서 element는 속성 값을 변경하려는 HTML 요소를 나타냅니다. name은 변경하려는 속성의 이름을 나타내며, value는 새로운 속성 값을 나타냅니다.
 
예를 들어, 다음 코드는 id가 "myButton"인 버튼의 value 속성 값을 "Click me!"에서 "Clicked!"로 변경합니다.
 
<button id="myButton" value="Click me!" onclick="myFunction()">Click me!</button>
 
function myFunction() {
    var button = document.getElementById("myButton");
    button.setAttribute("value", "Clicked!");
}

 

 
setAttribute 메서드는 다른 메서드와 함께 사용하여 HTML 요소의 여러 속성 값을 변경할 수도 있습니다. 예를 들어, 다음 코드는 id가 "myImage"인 이미지의 src와 alt 속성 값을 동시에 변경합니다.
 
<img id="myImage" src="image.jpg" alt="An image">

 

function changeImage() {
    var image = document.getElementById("myImage");
    image.setAttribute("src", "newimage.jpg");
    image.setAttribute("alt", "A new image");
}

 

 

자바스크립트 getAttribute

JavaScript에서 getAttribute() 메소드는 요소의 속성(attribute) 값을 가져오는 메소드입니다. 이 메소드는 DOM 요소 객체에서 호출됩니다. 사용법 예를 들어, 아래와 같은 HTML 코드가 있다고 가정해봅시다

newcodingman.tistory.com

 

댓글