내일배움캠프 74일차

김서영·2022년 12월 19일
0

내일배움캠프 TIL

목록 보기
76/85
post-custom-banner

1. 오늘 내가 한 일!

사용자에 따라 게시글&댓글의 수정 삭제 버튼을 보여주거나 보여주지 않는 코드를 작성하였다!
게시글에 대한 코드는 쉽게 작성되어서 댓글도 금방 끝날 줄 알았는데 한참 걸렸다ㅠㅠㅠ 그래도 오늘안에 해결해서 다행..

2. 알게된 것

1. 게시글 수정&삭제 버튼

const PutArticleBtn = document.getElementById("put_article") //게시글 수정
const DelArticleBtn = document.getElementById("del_article_btn") //게시글 삭제

function ButtonShow1(article_user_id){ # article_user_id는 위에서 받아온 것
        //로그인 유저!=게시글 작성유저면 버튼을 안보여주겠다.
        if(userId!=article_user_id){
            PutArticleBtn.style.display = 'none';
            DelArticleBtn.style.display = 'none';
        }
    }ButtonShow1(article_user_id)

2. 댓글 수정&삭제 버튼

const PutCommentBtn = document.getElementsByClassName("put_comment_btn")[i] //댓글수정버튼
const DelCommentBtn = document.getElementsByClassName("del_comment_btn")[i] //댓글삭제버튼

function ButtonShow2(detail_user_id){ # detail_user_id는 위에서 받아온 것
            //로그인 유저==댓글 작성유저면 버튼 보여주겠다. 아니면 안보여주겠다.
            if(userId==detail_user_id){
                PutCommentBtn.style.display = 'flex';
                DelCommentBtn.style.display = 'flex';
            }
            else{PutCommentBtn.style.display = 'none'; DelCommentBtn.style.display = 'none';}
            if(userId==article_user_id){ # 로그인유저==게시글 작성유저면 해당 게시글에 달린 모든 댓글에 대해 수정&삭제 버튼을 보여주겠다.
                PutCommentBtn.style.display = 'flex';
                DelCommentBtn.style.display = 'flex';
            }
        }
        ButtonShow2(detail_user_id)

3. getElementsByClassName

기존에는 id를 사용했었는데 계속 오류가 나서 class로 변경해서 해보니 해결되었다!!
class 이름으로 데이터를 가져오기 위해서는 인덱스 값으로 가져와야 하므로 마지막에 꼭 [i]같이 인덱스 값을 넣어줘야 한다! 나는 for문으로 도는 반복문에 이 코드를 사용하였으므로 i를 넣어주었다!

profile
개발과 지식의 성장을 즐기는 개발자
post-custom-banner

0개의 댓글