728x90
반응형

 

window.location.href
window.location.href = "url주소값" ; 해당 url주소값으로 이동
~~~ =window.location.href ; 해당 페이지의 url주소값 출력

 

 

ㄴㅁㄹ
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script>
      function pPage() {
        document.getElementById("demo").innerHTML =
          "이 웹페이지의 url주소는: " + window.location.href;
        /*
          window.location.href : 대입연산자(=) 기준 
          왼족에 위치하는 경우> 해당 url로 이동
          오른쪽은 해당 페이지의 url주소값 출력
        */
      }

      function btn(val) {
        switch (val) {
          case "n":
            // location.href = "https://www.naver.com";
            document.getElementsByTagName('a')[0].href =
              "https://www.naver.com";
            break;
          case "d":
            location.href = "https://www.daum.net";
            break;
          default:
            location.href = window.location.href;
        }
      }
    </script>
  </head>
  <body>
    <h2>BOM</h2>
    <h3>window.location object</h3>
    <p id="demo"></p>
    <a href="">페이지 이동</a>
    <button onclick="pPage()">현재 페이지 url주소 반환</button><br><br>
    <button onclick="btn('n')">네이버로 이동</button>
    <button onclick="btn('d')">다음으로 이동</button>
    <button onclick="btn('a')">현재 페이지</button>
  </body>
</html>​

 

window.history.go(Number(arguments[0]));
 
window.history.back();
바로 전 웹페이지로 이동
 
window.history.forward();
 

 

ㅁㄴㄹ
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script>
      function goBack() {
        if (arguments.length > 0) {
          // 2번째 전으로 웹페이지 이동
          window.history.go(Number(arguments[0]));
        } else {
          // 바로 전으로 웹페이지 이동
          window.history.back();
        }
      }
      function goForward() {
        if (arguments.length > 0) {
          window.history.go(Number(arguments[0]));
          // 2번째 앞으로 웹페이지 이동
        } else {
          window.history.forward();
        }
      }
    </script>
  </head>
  <body>
    <h2>BOM</h2>
    <h3>window.histroy object</h3>
    <input type="button" value="1번 뒤로" onclick="goBack()" />
    <input type="button" value="2번 뒤로" onclick="goBack(-2)" />
    <input type="button" value="1번 앞으로" onclick="goForward()" />
    <input type="button" value="2번 앞으로" onclick="goForward(2)" />
  </body>
</html>​
728x90
반응형
저작자표시 비영리 변경금지

'[JS]' 카테고리의 다른 글

[JS] querySelector, querySelectorAll  (0) 2024.03.04
[JS] callfunction  (0) 2024.03.04
[JS] BOM(Browser Object Model)  (0) 2024.03.04
[JS] dom (전체선택, 선택한 option 표기)  (0) 2024.03.04
[JS] ex)email 문자 객체를 이용한 예제  (0) 2024.02.29

+ Recent posts

티스토리툴바