Programming/JavaScript+CSS

[JavaScript] 자식 창에서 부모 창 새로고침

rw- 2024. 9. 20. 08:51
728x90

부모 창을 새로 고침하려면 자식 창에서 window.opener를 사용하여 부모 창의 location.reload() 메서드를 호출할 수 있습니다. 아래는 간단한 예제입니다.

 

1. 부모 창의 HTML (parent.html)

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>부모 창</title>
</head>
<body>
    <h1>부모 창</h1>
    <button onclick="openChild()">자식 창 열기</button>

    <script>
        function openChild() {
            window.open('child.html', 'childWindow', 'width=400,height=400');
        }

        function refresh() {
            location.reload();
        }
    </script>
</body>
</html>

 

2. 자식 창의 HTML (child.html)

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>자식 창</title>
</head>
<body>
    <h1>자식 창</h1>
    <button onclick="refreshParent()">부모 창 새로 고침</button>

    <script>
        function refreshParent() {
            if (window.opener) {
                window.opener.location.reload();
            }
        }
    </script>
</body>
</html>

 

설명
- 부모 창 (parent.html): 버튼을 클릭하면 자식 창을 엽니다.
- 자식 창 (child.html): 버튼을 클릭하면 부모 창을 새로 고칩니다.

이렇게 하면 자식 창에서 부모 창을 새로 고칠 수 있습니다.

728x90
반응형