In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > HTML DOM > properties > opener (window)

opener property (window)

Browser support:

Sets or retrieves a reference to the window that opened the current document.

If a document opens a page in a new browser window (for example, by an anchor element or the open method), then the opener property can be used in the child document to access the parent window object.
If the current document is within a frame or iframe and you need the window that hosts the current window, use the parent property.

Note that because of security restrictions, the contents of a document can be accessed from another document only if the two documents are located in the same domain.

Syntax:

object.opener;

You can find the related objects in the Supported by objects section below.

This property is read/write.

Possible values:

Reference to the opener window.

Default: this property has no default value.

Example HTML code 1:

This example shows how to open a child window and communicate between the opener and the child window:

Code

childWindow.htm

<head>
    <script type="text/javascript">
        function OpenChildWindow () {
            window.open ("childWindow.htm", "OpenerTest", "width=300, height=200");
        }
    </script>
</head>
<body>
    First open a child window with this button:
    <button id="childOpener" onclick="OpenChildWindow ();">Open child window!</button>
    <br /><br />
    You can change the text color of the button with the selection list of the child window.
</body>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Modeless window example</title>
    <script type="text/javascript">
        function ChangeOpener (selectTag) {
            var openerWindow = window.opener;
            var button = openerWindow.document.getElementById ("childOpener");
            button.style.color = selectTag.options[selectTag.selectedIndex].text;
        }
    </script>
<body>
    Change the color of the button in the opener window:
    <select onchange="ChangeOpener (this)">
        <option />black
        <option />red
        <option />blue
        <option />green
    </select>
</body>
</html>