TIL

[23.06.05]내배캠 4주차 1일

heediv 2023. 6. 5. 23:50
반응형

git hub로 협업하기

상세페이지 만들기

 

window.open과window.location.href 차이

[출처] [자바스크립트] location.href 와 location.replace 의 차이점.|작성자 왕따짱

  location.href location.replace 


 기능

새로운 페이지로 이동된다.

기존페이지를 새로운 페이지로 변경시킨다. 


 형태

속성 

메서드 
 
주소 히스토리

기록된다 

기록되지 않는다.


 사용예

location.href='abc.php' 

location.replace('abc.php') 

 

location.href는 객체의 속성이며, loaction.replace()는 메서드(함수)로 작동된다.

href는 페이지를 이동하는 것이기 때문에 뒤로가기 버튼을 누른경우 이전 페이지로 이동이 가능하지만,

replace는 현재 페이지를 새로운 페이지로 덮어 씌우기 때문에 이전 페이지로 이동이 불가능하다.

 

href는 일반적인 페이지 이동시 이용을 하면 되고,

replace의 경우는 이전페이지로 접근이 필요없는경우 보안상 덮어씌우는 것도 괜찮을듯 하다.

 

카드 클릭시 새로운페이지가 나타나도록 하기 위해 location.href를 사용하였다.

 

// 상세페이지 만들기
function showNewpage() {
  window.location.href="./specific.html"
}

// 상세페이지 만들기2
function showNewpage() {
  window.open('specific.html')
}

template 에서 카드 클릭시 showNewpage() 함수가 실행되도록 onclick = 'showNewpage()' 추가 

      let template = ` <div class="card" onclick = 'showNewpage()'>
                            <img onclick='showId(${movie.id})'  class="img" src="https://image.tmdb.org/t/p/w500${movie.poster_path}" alt="" />
                            <h3 class="movie-title">${movie.title}</h3>
                            <p class="movie_overview">
                            ${movie.overview}
                            </p>
                            <p class="movie_vote_average">💯Rating : ${movie.vote_average}</p>
                        </div>`;
_self : 새창이 아닌 자신의 창에서 열림열림
_blank :새로운 창을 연다.

1. 새 창 만들기

window.open('HTML이름.html')

2. 새창이 아닌 자신의 창에서 새로운 페이지가 열림

window.open('HTML이름.html','_self')

3. 새창에서 새로운 페이지가 열림

window.open('HTML이름.html','_blank')

4. 새로운 창에 이름을 붙이고 새창을 2번이상 열때 같은창일 시 하나만 열림

window.open('HTML이름.html','ot 새창이름의 예시')

5. 새로운 페이지의 모양과 관련된 속성

window.open('HTML이름.html','_blank','width=200, height=200, resizable=yes')

 

git hub 협업 내용 작성한것 다 날라감.............................

다음 git hub 협업에서 다시 작성할 것....

 

remote branch 삭제하는 명령어 (원격 브랜치 삭제)

$ git push origin --delete [branch name]

 

반응형