js_practice/URLObject_1.html at master · 200wonman/js_practice · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <script>


//        https://joalog.tistory.com/112

/*
        오늘은 URL객체에 대해 알아볼 것이다. Javascript에는 url을 간편하게 다룰 수 있도록 URL객체가 마련되어 있다.
        이것을 사용하면 프로토콜, 파라미터, 호스트 네임 변경과 같은 작업을 편하게 할 수 있다. 먼저 아래의 코드를 보자.
*/

        const url = new URL("http://testurl.co.kr:8080/path/main.html?param1=1&param2=3");
        const params = new URLSearchParams("param1=1&param2=3");

        console.log(url.hash); // ""
        console.log(url.host); // "testurl.co.kr:8080"
        console.log(url.hostname); // "testurl.co.kr"
        console.log(url.href); // "http://testurl.co.kr:8080/path/main.html?param1=1&param2=3"
        console.log(url.origin); // "http://testurl.co.kr:8080"
        console.log(url.password); // ""
        console.log(url.pathname); // "/path/main.html"
        console.log(url.port); // "8080"
        console.log(url.protocol); // "http:"
        console.log(url.search); // "?param1=1&param2=3"
        console.log(url.searchParams); // URLSearchParams {}
        console.log(url.username); // ""

        /*
        위의 코드는 javascript로 URL객체를 생성한 것이다. URL객체를 생성하기 위해서는 생성자에 기본적인 URL을 입력해주어야 한다.
        'http://'또는 'https://'부터 url 형식에 맞게 작성해야한다. 아래는 생성된 URL객체가 갖고 있는 값이다.
        URL객체는 hash, host, hostname, href 등 여러가지 내용을 담고 있는데, 이 객체가 갖고있는 값들을 하나씩 살펴보자.
        */


    </script>

</body>
</html>