javaScript 에서 id 추가, 삭제 , 수정 하기

javaScript 에서 id 추가, 삭제 , 수정 하기

기존 javaScript 를 사용할때 class 를 수정한 적은 많은데 id 를 건들여본적이 없어서 같은 pupup 창을 사용해 save 와 update 를 처리하기에 애를 먹었습니다.

자 이제 id 를 삭제해보겠습니다.

id 삭제

하나의 예시로
id 가 save_Project 이고, class 가 popupfooter 라는 div 가 있다고 가정해보겠습니다.

    <div id = "save_Project" class = "popupfooter">
        save
     </div>

id 를 삭제 하기 위해선 기존 div 의 id 혹은 class 를 알아야합니다.

document.querySelector('.popupfooter').removeAttribute('id');

위와 같이 작성해주면 popupfooter 를 class 로 가지고있는 div 에서 id가 삭제 됩니다.

    <div class = "popupfooter">
        save
     </div>

위와같이 나오게 됩니다.

id 추가

이번엔 id 추가를 해보겠습니다.

삭제와 비슷하게 진행 가능합니다.

    document.querySelector('.popupfooter').id = 'save_Project';

로 입력하면 맨 위에 작성했던것 처럼 ID 가 추가 되어 아래와 같이 나오게 됩니다.

    <div id = "save_Project" class = "popupfooter">
        save
     </div>

id 수정

이번엔 id 수정을 해보겠습니다.

수정은 setAttribute 를 사용합니다.

    document.querySelector('.popupfooter').setAttribute("id", "edit_Project");

popupfooter class 의 id 를 edit_Project 로 변경하는 것 입니다.

    <div id = "edit_Project" class = "popupfooter">
        save
     </div>

이상입니다.