JavaScript пропонує вбудовані методи відкривання та закривання вікна браузера для виконання додаткових операцій, як-от вікно робота тощо. Ці методи допомагають відкривати чи закривати спливаючі вікна браузера. Нижче наведено віконні методи:

ВІДЧИНЕНО() закрити()

The вікно.відкрите метод використовується для відкриття нової веб-сторінки в новому вікні та вікно.закрити метод закриття веб-сторінки, відкритої методом window.open. Докладніше про метод window.open():

Window.open()

Це попередньо визначений віконний метод JavaScript використовується для відкриття нової вкладки або вікна в браузері. Це залежатиме від налаштувань вашого браузера або параметрів, переданих у методі window.open(), які відкриватимуть нове вікно чи вкладку.

Цей метод підтримується майже всіма популярними веб-переглядачами, такими як Chrome, Firefox , тощо. Нижче наведено синтаксис і параметри методу відкриття вікна -

Синтаксис

Ця функція приймає чотири параметри, але вони необов’язкові.

 window.open(URL, name, specs, replace); 

Або

Ви також можете використовувати цю функцію без використання вікно ключове слово, як показано нижче:

 open(URL, name, specs, replace) 

Між обома синтаксисами немає різниці.

Список параметрів

Нижче наведено список параметрів методу window.open(). Зауважте, що всі параметри цього методу є необов’язковими та працюють інакше.

URL: Цей додатковий параметр функції window.open() містить рядок URL-адреси веб-сторінки, яку ви хочете відкрити. Якщо ви не вкажете URL-адресу в цій функції, відкриється нове порожнє вікно ( про: порожній ).

ім'я: За допомогою цього параметра ви можете встановити назву вікна, яке ви збираєтеся відкрити. Він підтримує такі значення:

Вказані вище значення передаються в одинарних або подвійних лапках у функцію window.open() у місці параметра імені.

дискета

характеристики: Цей параметр містить налаштування, розділені комою. Елемент, який використовується в цьому параметрі, не може містити пробіли, наприклад, ширина=150, висота=100 .

Він підтримує кілька значень.

замінити: Як і інші параметри методу window.open(), це також необов’язковий параметр. Він або створює новий запис, або замінює поточний запис у списку історії. Він підтримує два логічних значення; це означає, що він повертає або true, або false:

Повернуті значення

Він поверне щойно відкрите вікно.

Приклади

Ось кілька прикладів функції window.open() для відкриття вікна/вкладки браузера. За замовчуванням указана URL-адреса відкривається в новій вкладці або вікні. Перегляньте приклади нижче:

1. open() з параметром URL

Це простий приклад методу відкриття вікна з URL-адресою веб-сайту. Ми використали кнопку. Якщо натиснути цю кнопку, метод window.open() викличе та відкриє веб-сайт у новій вкладці браузера.

Копіювати код

 Click the button to open new window <br> <br> Open Window 

Або

Цей код можна записати, як наведено нижче -

Копіювати код

 function openWindow() { window.open(&apos;https://www.javatpoint.com&apos;); } Click the button to open new window <br> <br> Open Window 

Вихід

Коли ви натискаєте на це Відкрите вікно кнопку, сайт javatpoint відкриється в новій вкладці в тому самому вікні.

Перегляньте знімок екрана нижче:

2. open() без параметрів

У цьому прикладі ми не передаємо параметри функції window.open(), щоб нова вкладка відкрилася в попередньому вікні.

Копіювати код

 function openWindow() { window.open(); } Click the button to open new window <br> <br> Open Window 

Вихід

Коли ви виконаєте наведений вище код, з ним з’явиться кнопка.

Коли ви натискаєте це Відкрите вікно кнопку, у новій вкладці відкриється порожнє вікно.

3. open() з параметрами імені

У цьому прикладі ми вкажемо _батько у параметрі імені. Ви можете передати будь-яке з цих значень (_parent, _blank, _top тощо).

Копіювати код

 function openWindow() { window.open(&apos;https://gmail.com&apos;, &apos;_parent&apos;); } <b> Click the button to open new window in same tab </b> <br> <br> Open Window 

Вихід

Виконайте код і отримайте результат, як наведено нижче. Це міститиме кнопку, щоб натиснути та відкрити нову URL-адресу в тому самому батьківському вікні.

Коли ви натиснете цю кнопку, Gmail відкриється в тому самому батьківському вікні.

Коли ви передасте різні значення в другому параметрі, ви побачите різницю для різних значень.

4. Визначте розмір нового вікна

У цьому прикладі ми вкажемо висоту та ширину для нового вікна. Для цього будемо використовувати третій параметр ( характеристики ) у методі window.open() і передайте цій функції висоту та ширину вікна, розділених комою. Отже, вікно відкриється в заданому розмірі.

Копіювати код

 function openWindow() { window.open(&apos;&apos;, &apos;&apos;, &apos;width=300,height=200&apos;); } <b> Click the button to open new window in same tab </b> <br> <br> Open Window 

Вихід

Виконайте наведений вище код і отримайте результат, як наведено нижче. Це міститиме кнопку, щоб натиснути та відкрити нову URL-адресу в тому самому батьківському вікні.

Коли ви натиснете цю кнопку, під батьківським вікном розміру відкриється нове порожнє вікно.

Зауважте, що ви також можете передати URL методу window.open(), щоб відкрити будь-який веб-сайт.

Відкрийте нове вікно з назвою та повідомленням

Ми можемо показати будь-який визначений користувачем текст або форму в новому вікні, яке ми збираємось відкрити після натискання кнопки. Для цього нам потрібно дати будь-яке ім'я новому вікну і вписати в нього певний текст. Це ім’я буде передано методу window.open(). Подивіться наведений нижче код, як він буде реалізований із фактичним кодуванням.

Копіювати код

 function openWindow() { var newtab = window.open(&apos;&apos;, &apos;anotherWindow&apos;, &apos;width=300,height=150&apos;); newtab.document.write(&apos;<p> This is &apos;anotherWindow&apos;. It is 300px wide and 150px tall new window! </p>&apos;); } <b> Click the button to open the new user-defined sized window </b> <br> <br> Open Window 

Вихід

Виконайте код і отримайте результат, як наведено нижче. Він міститиме кнопку, щоб натиснути та відкрити нову URL-адресу в тому самому батьківському вікні.

Після натискання цієї кнопки відкриється нове вікно з користувацьким повідомленням під батьківським вікном розміром 300*150.

JavaScript також пропонує вбудований метод, тобто close(), щоб закрити вікно браузера.

Удачі

Закрити вікно, відкрите за допомогою window.open()

У цьому прикладі ми покажемо, як закрити вікно або вкладку, відкриті за допомогою методу window.open(). По-перше, ми відкриємо URL-адресу веб-сайту в новому вікні (розмір, визначений у коді), натиснувши кнопку, а потім використаємо іншу кнопку, щоб закрити відкрите вікно. Подивіться код нижче, як це буде зроблено:

Копіювати код

 Open and close window method example // function to open the new window tab with specified size function windowOpen() { var newWindow = window.open( &apos;https://www.javatpoint.com/&apos;, &apos;_blank&apos;, &apos;width=500, height=350&apos;); } // function to close the window opened by window.open() function windowClose() { newWindow.close(); } <h2> Window open() and close() method </h2> <b> Click the button to open Javatpoint tutorial site </b> <br> Open Javatpoint <br> <br> <b> Click the button to close Javatpoint tutorial site </b> <br> Close Javatpoint 

Вихід

Коли ви виконаєте код, ви отримаєте відповідь, як показано нижче:

Натисніть на Відкрийте Javatpoint кнопку, щоб відкрити навчальний веб-сайт Javatpoint. Ми вказали розмір (висоту та ширину) нового спливаючого вікна, яке потрібно відкрити.

Якщо натиснути кнопку Закрийте Javatpoint це відкрите вікно буде згорнуто.

Підтримка браузера

Деякі веб-браузери підтримують метод window.open(), наприклад:

• Chrome
• Mozilla Firefox
• Internet Explorer (IE)
• Опера
• Сафарі та ін.

Ви можете використовувати та запускати метод window.open() у наведених вище браузерах.

Примітка. Ви можете використовувати метод close() JavaScript, щоб закрити відкрите вікно браузера або вкладку, відкриту за допомогою window.open(). Ми обговоримо це в наступному розділі більш детально.