Closing a Child Window with JavaScript
window.close() can close the current script-closable window, and a parent can call close() on a window reference it previously opened. Browsers generally do not let ordinary scripts close a normal tab that the user opened directly.
On this page
To know how to open a child or small window, read the parent-window tutorial. You can also refresh the parent window before closing a child.
Self closing window Top ↑
The original close-button facility is retained as complete source:
<button type="button" id="closeWindow">Close this window</button>
<script>
document.getElementById("closeWindow").addEventListener("click", () => window.close());
</script>Pass data between parent and child windows and refresh part of the parent window after child data changes.
Closing an open child from the parent Top ↑
demo of Opening and closing child window
The historical parent.htm URL is retained and redirects to the working PHP demo.
Complete source code Top ↑
Parent page
<!doctype html>
<html lang="en">
<head><meta charset="utf-8"><title>Open and close child window</title></head>
<body>
<button type="button" id="openChild">Open</button>
<button type="button" id="closeChild">Close</button>
<script>
let childWindow = null;
document.getElementById("openChild").addEventListener("click", () => {
childWindow = window.open("child.htm", "Ratting", "width=550,height=170,top=260,status=0");
});
document.getElementById("closeChild").addEventListener("click", () => {
if (childWindow && !childWindow.closed) childWindow.close();
});
</script>
</body>
</html>Child page
<!doctype html>
<html lang="en">
<head><meta charset="utf-8"><title>Demo child window</title></head>
<body><p>This is child window</p></body>
</html>Browser restrictions on close() Top ↑
Closing is most reliable for windows created by web content, especially via window.open(). If the user opened a normal browser tab through browser UI, window.close() may be ignored.
Window object Reference Passing data from Child window to parent window Window onload to execute code
Subhendu Mohapatra
Author & Instructor at plus2net
I write and maintain practical tutorials on Python, PHP, SQL, JavaScript, HTML, jQuery, and web development at plus2net. The tutorials focus on clear explanations, working examples, and code that readers can test and adapt while learning.
Subscribe to our YouTube Channel here
