Window: open() 方法

可用性有限

此特性不是基線特性，因為它在一些最廣泛使用的瀏覽器中不起作用。

Window 介面的 open() 方法將指定資源載入到一個新的或現有的瀏覽上下文（即選項卡、視窗或 </code>）中，並給定一個指定名稱。</p> </section> </div> <aside class="reference-layout__toc"> <nav class="reference-toc"> <h2>本文內容</h2> <ul> <li><a href="#syntax">語法</a></li><li><a href="#description">描述</a></li><li><a href="#examples">示例</a></li><li><a href="#progressive_enhancement">漸進增強</a></li><li><a href="#same-origin_policy">同源策略</a></li><li><a href="#accessibility_concerns">可訪問性考慮</a></li><li><a href="#specifications">規範</a></li><li><a href="#browser_compatibility">瀏覽器相容性</a></li><li><a href="#see_also">另見</a></li> </ul> </nav> <mdn-placement-sidebar></mdn-placement-sidebar> </aside> <div class="reference-layout__body"> <section class="content-section" aria-labelledby="syntax"> <h2 id="syntax" class="heading"><a class="heading-anchor" href="#syntax">語法</a></h2> <div class="code-example"><div class="example-header"><span class="language-name">js</span></div><pre class="brush: js notranslate"><code>open() open(url) open(url, target) open(url, target, windowFeatures) </code></pre></div> </section><section class="content-section" aria-labelledby="parameters"> <h3 id="parameters" class="heading"><a class="heading-anchor" href="#parameters">引數</a></h3> <dl> <dt id="url"><a href="#url"><code>url</code> <span class="badge inline optional">可選</span></a></dt> <dd> <p>一個字串，表示要載入資源的 URL 或路徑。如果指定空字串（<code>""</code>）或省略此引數，則在目標瀏覽上下文中開啟一個空白頁面。</p> </dd> <dt id="target"><a href="#target"><code>target</code> <span class="badge inline optional">可選</span></a></dt> <dd> <p>一個不含空格的字串，指定資源載入到的瀏覽上下文的 <a href="/en-US/docs/Web/API/Window/name">名稱</a>。如果該名稱未識別出現有上下文，則會建立一個新上下文並賦予指定的名稱。還可以使用特殊的 <a href="/en-US/docs/Web/HTML/Reference/Elements/a#target"><code>target</code> 關鍵字</a>，如 <code>_self</code>、<code>_blank</code>（預設）、<code>_parent</code>、<code>_top</code> 和 <code>_unfencedTop</code>。<code>_unfencedTop</code> 僅與 <a href="/en-US/docs/Web/API/Fenced_frame_API">Fenced Frames</a> 相關。</p> <p>此名稱可用作 <code><a></code> 或 <code><form></code> 元素的 <code>target</code> 屬性。</p> </dd> <dt id="windowfeatures"><a href="#windowfeatures"><code>windowFeatures</code> <span class="badge inline optional">可選</span></a></dt> <dd> <p>一個字串，包含以 <code>name=value</code> 形式表示的逗號分隔的視窗特性列表。布林值可以透過以下方式設定為 true：<code>name</code>、<code>name=yes</code>、<code>name=true</code> 或 <code>name=n</code>（其中 <code>n</code> 是任何非零整數）。這些特性包括視窗的預設大小和位置、是否開啟最小化彈出視窗等選項。支援以下選項：</p> <dl> <dt id="attributionsrc"><a href="#attributionsrc"><code>attributionsrc</code> <abbr class="icon icon-experimental" title="實驗性。未來行為可能會改變。"> <span class="visually-hidden">實驗性</span> </abbr></a></dt> <dd> <p>表示您希望瀏覽器在 <code>open()</code> 呼叫中傳送 <a href="/en-US/docs/Web/HTTP/Reference/Headers/Attribution-Reporting-Eligible"><code>Attribution-Reporting-Eligible</code></a> 標頭。此呼叫必須在使用者互動事件處理程式（例如 <code>click</code>）內，並在使用者互動後的五秒內透過<a href="/en-US/docs/Glossary/Transient_activation">瞬時啟用</a>完成。在伺服器端，這用於觸發在響應中傳送 <a href="/en-US/docs/Web/HTTP/Reference/Headers/Attribution-Reporting-Register-Source"><code>Attribution-Reporting-Register-Source</code></a> 標頭，以完成歸因源的註冊。</p> <p>此外，當 <code>open()</code> 方法完成時，瀏覽器還會觸發儲存相關聯的源資料（如 <a href="/en-US/docs/Web/HTTP/Reference/Headers/Attribution-Reporting-Register-Source"><code>Attribution-Reporting-Register-Source</code></a> 響應頭中提供）。</p> <p>有關更多詳細資訊，請參閱 <a href="/en-US/docs/Web/API/Attribution_Reporting_API">歸因報告 API</a>。</p> <div class="notecard note"> <p><strong>注意：</strong> <code>open()</code> 呼叫不能用於註冊歸因觸發器。</p> </div> </dd> <dt id="popup"><a href="#popup"><code>popup</code></a></dt> <dd> <p>預設情況下，<code>window.open</code> 在新標籤頁中開啟頁面。如果 <code>popup</code> 設定為 true，它會請求使用一個最小化的彈出視窗。彈出視窗中包含的使用者介面功能將由瀏覽器自動決定，通常只包括一個位址列。如果 <code>popup</code> 存在並設定為 false，仍然會開啟一個新標籤頁。</p> <p>有一些遺留特性曾用於控制開啟視窗的 UI 功能。在現代瀏覽器中，它們僅具有請求彈出視窗的效果。如果 <code>popup</code> 未指定，並且 <code>windowFeatures</code> 包含除 <code>noopener</code>、<code>noreferrer</code> 或 <code>attributionsrc</code> 之外的任何特性（包括無法識別的特性），則如果滿足以下任何條件，視窗也會作為彈出視窗開啟：</p> <ul> <li><code>location</code> 和 <code>toolbar</code> 都為 false 或缺失</li> <li><code>menubar</code> 為 false 或缺失</li> <li><code>resizable</code> 為 false</li> <li><code>scrollbars</code> 為 false 或缺失</li> <li><code>status</code> 為 false 或缺失</li> </ul> <p>否則，視窗將作為標籤頁開啟。</p> </dd> <dt id="width"><a href="#width"><code>width</code> 或 <code>innerWidth</code></a></dt> <dd> <p>指定內容區域的寬度，包括捲軸。所需最小值為 100。</p> </dd> <dt id="height"><a href="#height"><code>height</code> 或 <code>innerHeight</code></a></dt> <dd> <p>指定內容區域的高度，包括捲軸。所需最小值為 100。</p> </dd> <dt id="left"><a href="#left"><code>left</code> 或 <code>screenX</code></a></dt> <dd> <p>指定新視窗在使用者作業系統定義的工作區左側的畫素距離。</p> </dd> <dt id="top"><a href="#top"><code>top</code> 或 <code>screenY</code></a></dt> <dd> <p>指定新視窗在使用者作業系統定義的工作區頂部的畫素距離。</p> </dd> <dt id="noopener"><a href="#noopener"><code>noopener</code></a></dt> <dd> <p>如果設定此特性，新視窗將無法透過 <a href="/en-US/docs/Web/API/Window/opener"><code>Window.opener</code></a> 訪問源視窗，並返回 <code>null</code>。</p> <p>當使用 <code>noopener</code> 時，除了 <code>_top</code>、<code>_self</code> 和 <code>_parent</code> 之外的非空目標名稱，在決定是否開啟新的瀏覽上下文時，都會被視為 <code>_blank</code>。</p> </dd> <dt id="noreferrer"><a href="#noreferrer"><code>noreferrer</code></a></dt> <dd> <p>如果設定此特性，瀏覽器將省略 <a href="/en-US/docs/Web/HTTP/Reference/Headers/Referer"><code>Referer</code></a> 標頭，並將 <code>noopener</code> 設定為 true。有關更多資訊，請參閱 <a href="/en-US/docs/Web/HTML/Reference/Attributes/rel/noreferrer"><code>rel="noreferrer"</code></a>。</p> </dd> </dl> <p><code>null</code> 值被視為與空字串（<code>""</code>）相同。</p> </dd> </dl> <div class="notecard note"> <p><strong>注意：</strong> 如果 <code>windowFeatures</code> 中請求的任何位置（<code>top</code>、<code>left</code>）和尺寸（<code>width</code>、<code>height</code>）值不允許整個瀏覽器彈出視窗在使用者作業系統的應用程式工作區內渲染，則這些值<strong>將被修正</strong>。換句話說，新彈出視窗的任何部分都不能初始定位在螢幕外。</p> </div> </section><section class="content-section" aria-labelledby="return_value"> <h3 id="return_value" class="heading"><a class="heading-anchor" href="#return_value">返回值</a></h3> <p>如果瀏覽器成功開啟新的瀏覽上下文，則返回一個 <a href="/en-US/docs/Glossary/WindowProxy"><code>WindowProxy</code></a> 物件。只要符合<a href="/en-US/docs/Web/Security/Same-origin_policy">同源策略</a>安全要求，返回的引用就可用於訪問新上下文的屬性和方法。</p> <p>如果使用 <a href="/en-US/docs/Web/HTTP/Reference/Headers/Cross-Origin-Opener-Policy"><code>Cross-Origin-Opener-Policy</code></a> HTTP 標頭，並且文件策略使文件在新<a href="/en-US/docs/Glossary/Browsing_context">瀏覽上下文組</a>中開啟，則對已開啟視窗的引用將被切斷，並且返回的物件將指示已開啟視窗已關閉（<a href="/en-US/docs/Web/API/Window/closed" title="closed"><code>closed</code></a> 為 <code>true</code>）。</p> <p>如果瀏覽器無法開啟新的瀏覽上下文，例如因為它被瀏覽器彈出視窗阻止程式阻止，則返回 <code>null</code>。</p> </section><section class="content-section" aria-labelledby="description"> <h2 id="description" class="heading"><a class="heading-anchor" href="#description">描述</a></h2> <p><code>Window</code> 介面的 <code>open()</code> 方法將 URL 作為引數，並將其標識的資源載入到新的或現有的選項卡或視窗中。<code>target</code> 引數確定將資源載入到哪個視窗或選項卡中，而 <code>windowFeatures</code> 引數可用於控制開啟具有最小 UI 功能的新彈出視窗，並控制其大小和位置。</p> <p>遠端 URL 不會立即載入。當 <code>window.open()</code> 返回時，視窗總是包含 <code>about:blank</code>。URL 的實際獲取被推遲，並在當前指令碼塊執行完成後開始。視窗建立和引用資源的載入是非同步完成的。</p> <p>現代瀏覽器有嚴格的彈出視窗阻止策略。彈出視窗必須直接響應使用者輸入而開啟，並且每次 <code>Window.open()</code> 呼叫都需要單獨的使用者手勢事件。這可以防止網站向用戶傳送大量視窗。然而，這給多視窗應用程式帶來了問題。為了解決這個限制，您可以設計您的應用程式以：</p> <ul> <li>一次最多開啟一個新視窗。</li> <li>重用現有視窗以顯示不同的頁面。</li> <li>建議使用者如何更新瀏覽器設定以允許開啟多個視窗。</li> </ul> </section><section class="content-section" aria-labelledby="examples"> <h2 id="examples" class="heading"><a class="heading-anchor" href="#examples">示例</a></h2>  </section><section class="content-section" aria-labelledby="opening_a_new_tab"> <h3 id="opening_a_new_tab" class="heading"><a class="heading-anchor" href="#opening_a_new_tab">開啟新標籤頁</a></h3> <div class="code-example"><div class="example-header"><span class="language-name">js</span></div><pre class="brush: js notranslate"><code>window.open("https://www.mozilla.org/", "mozillaTab"); </code></pre></div> </section><section class="content-section" aria-labelledby="opening_a_popup"> <h3 id="opening_a_popup" class="heading"><a class="heading-anchor" href="#opening_a_popup">開啟彈出視窗</a></h3> <p>另外，以下示例演示瞭如何使用 <code>popup</code> 特性開啟彈出視窗。</p> <div class="code-example"><div class="example-header"><span class="language-name">js</span></div><pre class="brush: js notranslate"><code>window.open("https://www.mozilla.org/", "mozillaWindow", "popup"); </code></pre></div> <p>可以控制新彈出視窗的大小和位置</p> <div class="code-example"><div class="example-header"><span class="language-name">js</span></div><pre class="brush: js notranslate"><code>const windowFeatures = "left=100,top=100,width=320,height=320"; const handle = window.open( "https://www.mozilla.org/", "mozillaWindow", windowFeatures, ); if (!handle) { // The window wasn't allowed to open // This is likely caused by built-in popup blockers. // … } </code></pre></div> </section><section class="content-section" aria-labelledby="progressive_enhancement"> <h2 id="progressive_enhancement" class="heading"><a class="heading-anchor" href="#progressive_enhancement">漸進增強</a></h2> <p>在某些情況下，JavaScript 被停用或不可用，並且 <code>window.open()</code> 將不起作用。我們不應僅僅依賴此功能的存在，而應提供替代解決方案，以使網站或應用程式仍然能夠執行。</p> </section><section class="content-section" aria-labelledby="provide_alternative_ways_when_javascript_is_disabled"> <h3 id="provide_alternative_ways_when_javascript_is_disabled" class="heading"><a class="heading-anchor" href="#provide_alternative_ways_when_javascript_is_disabled">當 JavaScript 被停用時提供替代方法</a></h3> <p>如果 JavaScript 支援被停用或不存在，則使用者代理將相應地建立一個輔助視窗，或根據其對 <code>target</code> 屬性的處理來渲染引用的資源。目標和想法是為使用者提供（而不是<em>強加</em>）一種開啟引用資源的方式。</p> <h4 id="html">HTML</h4> <div class="code-example"><div class="example-header"><span class="language-name">html</span></div><pre class="brush: html notranslate"><code><a href="https://www.wikipedia.org/" target="OpenWikipediaWindow"> Wikipedia, a free encyclopedia (opens in another, possibly already existing, tab) </a> </code></pre></div> <h4 id="javascript">JavaScript</h4> <div class="code-example"><div class="example-header"><span class="language-name">js</span></div><pre class="brush: js notranslate"><code>let windowObjectReference = null; // global variable function openRequestedTab(url, windowName) { if (windowObjectReference === null || windowObjectReference.closed) { windowObjectReference = window.open(url, windowName); } else { windowObjectReference.focus(); } } const link = document.querySelector("a[target='OpenWikipediaWindow']"); link.addEventListener("click", (event) => { openRequestedTab(link.href); event.preventDefault(); }); </code></pre></div> <p>以上程式碼解決了與連結開啟彈出視窗相關的一些可用性問題。程式碼中 <code>event.preventDefault()</code> 的目的是取消連結的預設動作：如果執行了 <code>click</code> 事件監聽器，則無需執行連結的預設動作。但如果使用者的瀏覽器停用或不存在 JavaScript 支援，則 <code>click</code> 事件監聽器將被忽略，瀏覽器將在名為 <code>"WikipediaWindowName"</code> 的目標框架或視窗中載入引用的資源。如果沒有框架或視窗名為 <code>"WikipediaWindowName"</code>，則瀏覽器將建立一個新視窗並將其命名為 <code>"WikipediaWindowName"</code>。</p> <div class="notecard note"> <p><strong>注意：</strong> 有關 <code>target</code> 屬性的更多詳細資訊，請參閱 <code><a></code> 或 <code><form></code>。</p> </div> </section><section class="content-section" aria-labelledby="reuse_existing_windows_and_avoid_target_blank"> <h3 id="reuse_existing_windows_and_avoid_target_blank" class="heading"><a class="heading-anchor" href="#reuse_existing_windows_and_avoid_target_blank">重用現有視窗並避免使用 <code>target="_blank"</code></a></h3> <p>使用 <code>"_blank"</code> 作為 target 屬性值會在使用者桌面上建立多個新的、未命名的視窗，這些視窗無法回收或重用。嘗試為您的 <code>target</code> 屬性提供一個有意義的名稱，並在您的頁面上重用該 <code>target</code> 屬性，以便單擊另一個連結可以將引用的資源載入到已經建立和渲染的視窗中（從而加快使用者處理速度），從而證明建立輔助視窗的理由（以及使用者系統資源、花費的時間）。使用單個 <code>target</code> 屬性值並在連結中重用它對使用者資源更友好，因為它只建立一個可回收的輔助視窗。</p> <p>這是一個輔助視窗可以開啟並用於其他連結的示例：</p> <h4 id="html_2">HTML</h4> <div class="code-example"><div class="example-header"><span class="language-name">html</span></div><pre class="brush: html notranslate"><code><p> <a href="https://www.wikipedia.org/" target="SingleSecondaryWindowName"> Wikipedia, a free encyclopedia (opens in another, possibly already existing, tab) </a> </p> <p> <a href="https://support.mozilla.org/products/firefox" target="SingleSecondaryWindowName"> Firefox FAQ (opens in another, possibly already existing, tab) </a> </p> </code></pre></div> <h4 id="javascript_2">JavaScript</h4> <div class="code-example"><div class="example-header"><span class="language-name">js</span></div><pre class="brush: js notranslate"><code>let windowObjectReference = null; // global variable let previousURL; /* global variable that will store the url currently in the secondary window */ function openRequestedSingleTab(url) { if (windowObjectReference === null || windowObjectReference.closed) { windowObjectReference = window.open(url, "SingleSecondaryWindowName"); } else if (previousURL !== url) { windowObjectReference = window.open(url, "SingleSecondaryWindowName"); /* if the resource to load is different, then we load it in the already opened secondary window and then we bring such window back on top/in front of its parent window. */ windowObjectReference.focus(); } else { windowObjectReference.focus(); } previousURL = url; /* explanation: we store the current url in order to compare url in the event of another call of this function. */ } const links = document.querySelectorAll( "a[target='SingleSecondaryWindowName']", ); for (const link of links) { link.addEventListener("click", (event) => { openRequestedSingleTab(link.href); event.preventDefault(); }); } </code></pre></div> </section><section class="content-section" aria-labelledby="same-origin_policy"> <h2 id="same-origin_policy" class="heading"><a class="heading-anchor" href="#same-origin_policy">同源策略</a></h2> <p>如果新開啟的瀏覽上下文不共享相同的<a href="/en-US/docs/Glossary/Origin">源</a>，則開啟指令碼將無法與該瀏覽上下文的內容互動（讀取或寫入）。</p> <div class="code-example"><div class="example-header"><span class="language-name">js</span></div><pre class="brush: js example-bad notranslate"><code>// Script from example.com const otherOriginContext = window.open("https://example.org"); // example.com and example.org are not the same origin console.log(otherOriginContext.origin); // DOMException: Permission denied to access property "origin" on cross-origin object </code></pre></div> <div class="code-example"><div class="example-header"><span class="language-name">js</span></div><pre class="brush: js example-good notranslate"><code>// Script from example.com const sameOriginContext = window.open("https://example.com"); // This time, the new browsing context has the same origin console.log(sameOriginContext.origin); // https://example.com </code></pre></div> <p>有關更多資訊，請參閱<a href="/en-US/docs/Web/Security/Same-origin_policy">同源策略</a>文章。</p> </section><section class="content-section" aria-labelledby="accessibility_concerns"> <h2 id="accessibility_concerns" class="heading"><a class="heading-anchor" href="#accessibility_concerns">可訪問性考慮</a></h2>  </section><section class="content-section" aria-labelledby="avoid_resorting_to_window.open"> <h3 id="avoid_resorting_to_window.open" class="heading"><a class="heading-anchor" href="#avoid_resorting_to_window.open">避免使用 window.open()</a></h3> <p>出於以下幾個原因，最好避免使用 <code>window.open()</code>：</p> <ul> <li>現代瀏覽器提供彈出視窗阻止功能。</li> <li>現代瀏覽器提供標籤頁瀏覽功能，且支援標籤頁的瀏覽器使用者在大多數情況下更喜歡開啟新標籤頁而非新視窗。</li> <li>使用者可能會使用瀏覽器內建功能或擴充套件來選擇是將連結在新視窗中開啟、在同一視窗中開啟、在新標籤頁中開啟、在同一標籤頁中開啟，還是在後臺開啟。強制使用 <code>window.open()</code> 以特定方式開啟會讓他們感到困惑並無視他們的習慣。</li> <li>彈出視窗沒有選單工具欄，而新標籤頁使用瀏覽器視窗的使用者介面；因此，許多使用者更喜歡標籤頁瀏覽，因為介面保持穩定。</li> </ul> </section><section class="content-section" aria-labelledby="never_use_window.open_inline_in_html"> <h3 id="never_use_window.open_inline_in_html" class="heading"><a class="heading-anchor" href="#never_use_window.open_inline_in_html">切勿在 HTML 中內聯使用 window.open()</a></h3> <p>避免使用 <code><a href="#" onclick="window.open(…);"></code> 或 <code><a href="javascript:window\.open(…)" …></code>。</p> <p>這些偽造的 <code>href</code> 值在複製/拖動連結、在新標籤頁/視窗中開啟連結、新增書籤或在 JavaScript 載入、出錯或被停用時會導致意外行為。它們還會向輔助技術（如螢幕閱讀器）傳達不正確的語義。</p> <p>如有必要，請改用 <code><button></code> 元素。通常，<em>您應該只將連結用於導航到真實的 URL</em>。</p> </section><section class="content-section" aria-labelledby="always_identify_links_leading_to_a_secondary_window"> <h3 id="always_identify_links_leading_to_a_secondary_window" class="heading"><a class="heading-anchor" href="#always_identify_links_leading_to_a_secondary_window">始終標識指向輔助視窗的連結</a></h3> <p>以幫助使用者導航的方式標識將開啟新視窗的連結。</p> <div class="code-example"><div class="example-header"><span class="language-name">html</span></div><pre class="brush: html notranslate"><code><a target="WikipediaWindow" href="https://www.wikipedia.org"> Wikipedia (opens in new tab) </a> </code></pre></div> <p>目的是警告使用者上下文變化，以最大程度地減少使用者的困惑：更改當前視窗或彈出新視窗可能會讓使用者感到非常迷失方向（對於彈出視窗，沒有工具欄提供“上一步”按鈕返回上一個視窗）。</p> <p>當上下文的極端變化在發生前明確標識時，使用者可以決定是否繼續，或者他們可以為變化做好準備：他們不僅不會感到困惑或迷失方向，而且經驗豐富的使用者可以更好地決定如何開啟此類連結（是否在新視窗中開啟，是否在同一視窗中開啟，是否在新標籤頁中開啟，是否在“後臺”開啟）。</p> <ul> <li><a href="https://webaim.org/techniques/hypertext/hypertext_links" class="external" target="_blank">WebAIM：連結和超文字 - 超文字連結</a></li> <li><a href="/en-US/docs/Web/Accessibility/Guides/Understanding_WCAG/Understandable#guideline_3.2_—_predictable_make_web_pages_appear_and_operate_in_predictable_ways">MDN / 理解 WCAG，準則 3.2</a></li> <li><a href="https://www.w3.org/TR/WCAG20-TECHS/G200.html" class="external" target="_blank">G200：僅在必要時從連結開啟新視窗和標籤頁</a></li> <li><a href="https://www.w3.org/TR/WCAG20-TECHS/G201.html" class="external" target="_blank">G201：在新視窗開啟時提前向用戶發出警告</a></li> </ul> </section><section class="content-section" aria-labelledby="specifications"> <h2 id="specifications" class="heading"><a class="heading-anchor" href="#specifications">規範</a></h2> <table> <thead> <tr> <th scope="col">規範</th> </tr> </thead> <tbody> <tr> <td><a class="external" href="https://html.spec.whatwg.org/multipage/nav-history-apis.html#dom-open-dev" rel="noopener" target="_blank">HTML<br /># dom-open-dev</a></td> </tr><tr> <td><a class="external" href="https://drafts.csswg.org/cssom-view/#the-features-argument-to-the-open()-method" rel="noopener" target="_blank">CSSOM 檢視模組<br /># the-features-argument-to-the-open()-method</a></td> </tr> </tbody> </table> </section><section class="content-section" aria-labelledby="browser_compatibility"> <h2 id="browser_compatibility" class="heading"><a class="heading-anchor" href="#browser_compatibility">瀏覽器相容性</a></h2> <mdn-compat-table-lazy locale="en-US" query="api.Window.open"><template shadowroot="open" shadowrootmode="open"><style>*,:after,:before{box-sizing:border-box}button,input,select,textarea{font:inherit}button{color:inherit;cursor:pointer}img{height:auto;max-width:100%}a{color:var(--color-link-normal)}[hidden]{display:none!important}</style><p>載入中…</p></template></mdn-compat-table-lazy> </section><section class="content-section" aria-labelledby="see_also"> <h2 id="see_also" class="heading"><a class="heading-anchor" href="#see_also">另見</a></h2> <ul> <li><code>target</code> 屬性文件<ul> <li><a href="/en-US/docs/Web/HTML/Reference/Elements/a#target"><code><a></code></a></li> <li><a href="/en-US/docs/Web/HTML/Reference/Elements/form#target"><code><form></code></a></li> </ul> </li> <li><a href="/en-US/docs/Web/API/Window/close"><code>window.close()</code></a></li> <li><a href="/en-US/docs/Web/API/Window/closed"><code>window.closed</code></a></li> <li><a href="/en-US/docs/Web/API/Window/focus"><code>window.focus()</code></a></li> <li><a href="/en-US/docs/Web/API/Window/opener"><code>window.opener</code></a></li> <li><a href="/en-US/docs/Web/HTML/Reference/Attributes/rel#opener"><code>rel="opener"</code></a> 和 <a href="/en-US/docs/Web/HTML/Reference/Attributes/rel#noopener"><code>rel="noopener"</code></a></li> <li><a href="/en-US/docs/Web/Security/Same-origin_policy">同源策略</a></li> </ul> </section> <section class="content-section article-footer" aria-labelledby="feedback"> <div class="article-footer__inner"> <div class="article-footer__svg-container"><svg xmlns="http://www.w3.org/2000/svg" width="162" height="162" fill="none" viewBox="0 0 162 162"><mask id="b" fill="#fff"><path d="M97.203 47.04c8.113-7.886 18.004-13.871 28.906-17.492a78 78 0 0 1 33.969-3.39c11.443 1.39 22.401 5.295 32.024 11.411s17.656 14.28 23.476 23.86c5.819 9.579 9.269 20.318 10.083 31.385a69.85 69.85 0 0 1-5.387 32.44c-4.358 10.272-11.115 19.443-19.747 26.801-8.632 7.359-18.908 12.709-30.034 15.637l-6.17-21.698c7.666-2.017 14.746-5.703 20.694-10.773 5.948-5.071 10.603-11.389 13.606-18.467a48.14 48.14 0 0 0 3.712-22.352c-.561-7.625-2.938-15.025-6.948-21.625s-9.544-12.226-16.175-16.44-14.181-6.904-22.065-7.863a53.75 53.75 0 0 0-23.405 2.336c-7.513 2.495-14.327 6.62-19.918 12.053z"></path></mask><path stroke="url(#a)" stroke-dasharray="6, 6" stroke-width="2" d="M97.203 47.04c8.113-7.886 18.004-13.871 28.906-17.492a78 78 0 0 1 33.969-3.39c11.443 1.39 22.401 5.295 32.024 11.411s17.656 14.28 23.476 23.86c5.819 9.579 9.269 20.318 10.083 31.385a69.85 69.85 0 0 1-5.387 32.44c-4.358 10.272-11.115 19.443-19.747 26.801-8.632 7.359-18.908 12.709-30.034 15.637l-6.17-21.698c7.666-2.017 14.746-5.703 20.694-10.773 5.948-5.071 10.603-11.389 13.606-18.467a48.14 48.14 0 0 0 3.712-22.352c-.561-7.625-2.938-15.025-6.948-21.625s-9.544-12.226-16.175-16.44-14.181-6.904-22.065-7.863a53.75 53.75 0 0 0-23.405 2.336c-7.513 2.495-14.327 6.62-19.918 12.053z" mask="url(#b)" style="stroke:url(#a)" transform="translate(-63.992 -25.587)"></path><ellipse cx="8.066" cy="111.597" fill="currentColor" rx="53.677" ry="53.699" transform="matrix(.71707 -.697 .7243 .6895 0 0)"></ellipse><g clip-path="url(#c)" transform="translate(-63.992 -25.587)"><path fill="#9abff5" d="m144.256 137.379 32.906 12.434a4.41 4.41 0 0 1 2.559 5.667l-9.326 24.679a4.41 4.41 0 0 1-5.667 2.559l-8.226-3.108-2.332 6.17c-.466 1.233-.375 1.883-1.609 1.417l-2.253-.527c-.411-.155-.95-.594-1.206-1.161l-4.734-10.484-12.545-4.741a4.41 4.41 0 0 1-2.559-5.667l9.325-24.679a4.41 4.41 0 0 1 5.667-2.559m9.961 29.617 8.227 3.108 3.264-8.638-.498-6.768-4.113-1.555.548 7.258-4.319-1.632zm-12.339-4.663 8.226 3.108 3.264-8.637-.498-6.769-4.113-1.554.548 7.257-4.319-1.632z"></path></g><g clip-path="url(#d)" transform="translate(-63.992 -25.587)"><path fill="#81b0f3" d="M135.35 60.136 86.67 41.654c-3.346-1.27-7.124.428-8.394 3.775L64.414 81.938c-1.27 3.347.428 7.125 3.774 8.395l12.17 4.62-3.465 9.128c-.693 1.826-1.432 2.457.394 3.15l3.014 1.625c.609.231 1.637.274 2.477-.104l15.53-6.983 18.56 7.047c3.346 1.27 7.124-.428 8.395-3.775l13.862-36.51c1.27-3.346-.428-7.124-3.775-8.395M95.261 83.207l-12.17-4.62 4.852-12.779 7.19-7.017 6.085 2.31-7.725 7.51 6.389 2.426zm18.255 6.93-12.17-4.62 4.852-12.778 7.189-7.017 6.085 2.31-7.725 7.51 6.39 2.426z"></path></g><defs><clipPath id="c"><path fill="#fff" d="m198.638 146.586-65.056-24.583-24.583 65.057 65.056 24.582z"></path></clipPath><clipPath id="d"><path fill="#fff" d="m66.438 14.055 96.242 36.54-36.54 96.243-96.243-36.54z"></path></clipPath><linearGradient id="a" x1="97.203" x2="199.995" y1="47.04" y2="152.793" gradientUnits="userSpaceOnUse"><stop stop-color="#086DFC"></stop><stop offset=".246" stop-color="#2C81FA"></stop><stop offset=".516" stop-color="#5497F8"></stop><stop offset=".821" stop-color="#80B0F6"></stop><stop offset="1" stop-color="#9ABFF5"></stop></linearGradient></defs></svg></div> <h2 id="feedback">幫助改進 MDN</h2> <mdn-content-feedback locale="en-US"><template shadowroot="open" shadowrootmode="open"><style>.content-feedback{border:none;margin:0 0 .25rem;padding:0}.content-feedback>label{display:block;margin-bottom:.25rem}.content-feedback .thank-you{display:block;margin-bottom:calc(2.75rem + 2px)}.content-feedback mdn-button{flex:1;min-width:0}.content-feedback--buttons{display:inline-flex;gap:.75rem;margin:.25rem 0}.content-feedback--radios{align-items:center;display:flex;gap:.25rem;margin:.25rem 0}</style><fieldset class="content-feedback"> <label>此頁面對您有幫助嗎？ </label> <div class="content-feedback--buttons"> <mdn-button data-vote="yes" variant="secondary" action="positive" defer-hydration=""><template shadowroot="open" shadowrootmode="open"><style>.button{align-items:center;background-color:initial;border:1px solid #0000;border-radius:.25rem;color:var(--color-text-primary);column-gap:.3125em;cursor:pointer;display:inline-flex;font-family:var(--font-family-text);font-size:.875em;font-weight:450;justify-content:center;line-height:var(--font-line-ui);margin:0;padding:.5em;-webkit-text-decoration:none;text-decoration:none;vertical-align:middle}.button[data-variant=primary]{--csstools-light-dark-toggle-33eaa513-0:var(--csstools-color-scheme--light) var(--color-black);color:var(--csstools-light-dark-toggle-33eaa513-0,var(--color-white));--csstools-light-dark-toggle-33eaa513-1:var(--csstools-color-scheme--light) var(--color-white);background-color:var(--csstools-light-dark-toggle-33eaa513-1,var(--color-black))}@supports (color:light-dark(red,red)){.button[data-variant=primary]{background-color:light-dark(var(--color-black),var(--color-white));color:light-dark(var(--color-white),var(--color-black))}}.button[data-variant=primary]:hover{--csstools-light-dark-toggle-33eaa513-2:var(--csstools-color-scheme--light) var(--color-gray-80);background-color:var(--csstools-light-dark-toggle-33eaa513-2,var(--color-gray-20))}@supports (color:light-dark(red,red)){.button[data-variant=primary]:hover{background-color:light-dark(var(--color-gray-20),var(--color-gray-80))}}.button[data-variant=primary][data-action=positive]{color:var(--color-white);--csstools-light-dark-toggle-33eaa513-3:var(--csstools-color-scheme--light) var(--color-green-20);background-color:var(--csstools-light-dark-toggle-33eaa513-3,var(--color-green-50))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=positive]{background-color:light-dark(var(--color-green-50),var(--color-green-20))}}.button[data-variant=primary][data-action=positive]:hover{--csstools-light-dark-toggle-33eaa513-4:var(--csstools-color-scheme--light) var(--color-green-50);background-color:var(--csstools-light-dark-toggle-33eaa513-4,var(--color-green-20))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=positive]:hover{background-color:light-dark(var(--color-green-20),var(--color-green-50))}}.button[data-variant=primary][data-action=negative]{color:var(--color-white);--csstools-light-dark-toggle-33eaa513-5:var(--csstools-color-scheme--light) var(--color-red-20);background-color:var(--csstools-light-dark-toggle-33eaa513-5,var(--color-red-50))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=negative]{background-color:light-dark(var(--color-red-50),var(--color-red-20))}}.button[data-variant=primary][data-action=negative]:hover{--csstools-light-dark-toggle-33eaa513-6:var(--csstools-color-scheme--light) var(--color-red-50);background-color:var(--csstools-light-dark-toggle-33eaa513-6,var(--color-red-20))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=negative]:hover{background-color:light-dark(var(--color-red-20),var(--color-red-50))}}.button[data-variant=secondary]{border-color:currentcolor}.button[data-variant=secondary]:hover{--csstools-light-dark-toggle-33eaa513-7:var(--csstools-color-scheme--light) var(--color-gray-20);background-color:var(--csstools-light-dark-toggle-33eaa513-7,var(--color-gray-80))}@supports (color:light-dark(red,red)){.button[data-variant=secondary]:hover{background-color:light-dark(var(--color-gray-80),var(--color-gray-20))}}.button[data-variant=secondary][data-action=positive]{--csstools-light-dark-toggle-33eaa513-8:var(--csstools-color-scheme--light) var(--color-green-80);color:var(--csstools-light-dark-toggle-33eaa513-8,var(--color-green-50))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=positive]{color:light-dark(var(--color-green-50),var(--color-green-80))}}.button[data-variant=secondary][data-action=positive]:hover{--csstools-light-dark-toggle-33eaa513-9:var(--csstools-color-scheme--light) var(--color-green-10);background-color:var(--csstools-light-dark-toggle-33eaa513-9,var(--color-green-90))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=positive]:hover{background-color:light-dark(var(--color-green-90),var(--color-green-10))}}.button[data-variant=secondary][data-action=negative]{--csstools-light-dark-toggle-33eaa513-10:var(--csstools-color-scheme--light) var(--color-red-80);color:var(--csstools-light-dark-toggle-33eaa513-10,var(--color-red-50))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=negative]{color:light-dark(var(--color-red-50),var(--color-red-80))}}.button[data-variant=secondary][data-action=negative]:hover{--csstools-light-dark-toggle-33eaa513-11:var(--csstools-color-scheme--light) var(--color-red-10);background-color:var(--csstools-light-dark-toggle-33eaa513-11,var(--color-red-90))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=negative]:hover{background-color:light-dark(var(--color-red-90),var(--color-red-10))}}.button[data-variant=plain]:hover{--csstools-light-dark-toggle-33eaa513-12:var(--csstools-color-scheme--light) var(--color-gray-20);background-color:var(--csstools-light-dark-toggle-33eaa513-12,var(--color-gray-80))}@supports (color:light-dark(red,red)){.button[data-variant=plain]:hover{background-color:light-dark(var(--color-gray-80),var(--color-gray-20))}}.button[data-variant=plain][data-action=positive]{--csstools-light-dark-toggle-33eaa513-13:var(--csstools-color-scheme--light) var(--color-green-80);color:var(--csstools-light-dark-toggle-33eaa513-13,var(--color-green-50))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=positive]{color:light-dark(var(--color-green-50),var(--color-green-80))}}.button[data-variant=plain][data-action=positive]:hover{--csstools-light-dark-toggle-33eaa513-14:var(--csstools-color-scheme--light) var(--color-green-10);background-color:var(--csstools-light-dark-toggle-33eaa513-14,var(--color-green-90))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=positive]:hover{background-color:light-dark(var(--color-green-90),var(--color-green-10))}}.button[data-variant=plain][data-action=negative]{--csstools-light-dark-toggle-33eaa513-15:var(--csstools-color-scheme--light) var(--color-red-80);color:var(--csstools-light-dark-toggle-33eaa513-15,var(--color-red-50))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=negative]{color:light-dark(var(--color-red-50),var(--color-red-80))}}.button[data-variant=plain][data-action=negative]:hover{--csstools-light-dark-toggle-33eaa513-16:var(--csstools-color-scheme--light) var(--color-red-10);background-color:var(--csstools-light-dark-toggle-33eaa513-16,var(--color-red-90))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=negative]:hover{background-color:light-dark(var(--color-red-90),var(--color-red-10))}}.button[disabled]{--csstools-light-dark-toggle-33eaa513-17:var(--csstools-color-scheme--light) var(--color-gray-60)!important;color:var(--csstools-light-dark-toggle-33eaa513-17,var(--color-gray-40))!important;cursor:default;--csstools-light-dark-toggle-33eaa513-18:var(--csstools-color-scheme--light) var(--color-gray-20)!important;background-color:var(--csstools-light-dark-toggle-33eaa513-18,var(--color-gray-80))!important;border-color:#0000}@supports (color:light-dark(red,red)){.button[disabled]{background-color:light-dark(var(--color-gray-80),var(--color-gray-20))!important;color:light-dark(var(--color-gray-40),var(--color-gray-60))!important}}.button .icon{display:flex}.button svg{height:1.25em;width:1.25em}.button .label{padding-block:.125em;padding-inline:.0625em}:host{display:inline-flex;vertical-align:middle}.button{box-sizing:border-box;height:100%;width:100%}</style> <button class="button" aria-labelledby="label-4l5x56zr39c" data-variant="secondary" data-action="positive" part="button"> <span class="icon" part="icon"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"><path d="M7 10v12m8-16.12L14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88"></path></svg></span> <span id="label-4l5x56zr39c" class="label" part="label"><slot></slot></span>  </button> </template> 是 </mdn-button> <mdn-button data-vote="no" variant="secondary" action="negative" defer-hydration=""><template shadowroot="open" shadowrootmode="open"><style>.button{align-items:center;background-color:initial;border:1px solid #0000;border-radius:.25rem;color:var(--color-text-primary);column-gap:.3125em;cursor:pointer;display:inline-flex;font-family:var(--font-family-text);font-size:.875em;font-weight:450;justify-content:center;line-height:var(--font-line-ui);margin:0;padding:.5em;-webkit-text-decoration:none;text-decoration:none;vertical-align:middle}.button[data-variant=primary]{--csstools-light-dark-toggle-33eaa513-0:var(--csstools-color-scheme--light) var(--color-black);color:var(--csstools-light-dark-toggle-33eaa513-0,var(--color-white));--csstools-light-dark-toggle-33eaa513-1:var(--csstools-color-scheme--light) var(--color-white);background-color:var(--csstools-light-dark-toggle-33eaa513-1,var(--color-black))}@supports (color:light-dark(red,red)){.button[data-variant=primary]{background-color:light-dark(var(--color-black),var(--color-white));color:light-dark(var(--color-white),var(--color-black))}}.button[data-variant=primary]:hover{--csstools-light-dark-toggle-33eaa513-2:var(--csstools-color-scheme--light) var(--color-gray-80);background-color:var(--csstools-light-dark-toggle-33eaa513-2,var(--color-gray-20))}@supports (color:light-dark(red,red)){.button[data-variant=primary]:hover{background-color:light-dark(var(--color-gray-20),var(--color-gray-80))}}.button[data-variant=primary][data-action=positive]{color:var(--color-white);--csstools-light-dark-toggle-33eaa513-3:var(--csstools-color-scheme--light) var(--color-green-20);background-color:var(--csstools-light-dark-toggle-33eaa513-3,var(--color-green-50))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=positive]{background-color:light-dark(var(--color-green-50),var(--color-green-20))}}.button[data-variant=primary][data-action=positive]:hover{--csstools-light-dark-toggle-33eaa513-4:var(--csstools-color-scheme--light) var(--color-green-50);background-color:var(--csstools-light-dark-toggle-33eaa513-4,var(--color-green-20))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=positive]:hover{background-color:light-dark(var(--color-green-20),var(--color-green-50))}}.button[data-variant=primary][data-action=negative]{color:var(--color-white);--csstools-light-dark-toggle-33eaa513-5:var(--csstools-color-scheme--light) var(--color-red-20);background-color:var(--csstools-light-dark-toggle-33eaa513-5,var(--color-red-50))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=negative]{background-color:light-dark(var(--color-red-50),var(--color-red-20))}}.button[data-variant=primary][data-action=negative]:hover{--csstools-light-dark-toggle-33eaa513-6:var(--csstools-color-scheme--light) var(--color-red-50);background-color:var(--csstools-light-dark-toggle-33eaa513-6,var(--color-red-20))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=negative]:hover{background-color:light-dark(var(--color-red-20),var(--color-red-50))}}.button[data-variant=secondary]{border-color:currentcolor}.button[data-variant=secondary]:hover{--csstools-light-dark-toggle-33eaa513-7:var(--csstools-color-scheme--light) var(--color-gray-20);background-color:var(--csstools-light-dark-toggle-33eaa513-7,var(--color-gray-80))}@supports (color:light-dark(red,red)){.button[data-variant=secondary]:hover{background-color:light-dark(var(--color-gray-80),var(--color-gray-20))}}.button[data-variant=secondary][data-action=positive]{--csstools-light-dark-toggle-33eaa513-8:var(--csstools-color-scheme--light) var(--color-green-80);color:var(--csstools-light-dark-toggle-33eaa513-8,var(--color-green-50))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=positive]{color:light-dark(var(--color-green-50),var(--color-green-80))}}.button[data-variant=secondary][data-action=positive]:hover{--csstools-light-dark-toggle-33eaa513-9:var(--csstools-color-scheme--light) var(--color-green-10);background-color:var(--csstools-light-dark-toggle-33eaa513-9,var(--color-green-90))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=positive]:hover{background-color:light-dark(var(--color-green-90),var(--color-green-10))}}.button[data-variant=secondary][data-action=negative]{--csstools-light-dark-toggle-33eaa513-10:var(--csstools-color-scheme--light) var(--color-red-80);color:var(--csstools-light-dark-toggle-33eaa513-10,var(--color-red-50))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=negative]{color:light-dark(var(--color-red-50),var(--color-red-80))}}.button[data-variant=secondary][data-action=negative]:hover{--csstools-light-dark-toggle-33eaa513-11:var(--csstools-color-scheme--light) var(--color-red-10);background-color:var(--csstools-light-dark-toggle-33eaa513-11,var(--color-red-90))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=negative]:hover{background-color:light-dark(var(--color-red-90),var(--color-red-10))}}.button[data-variant=plain]:hover{--csstools-light-dark-toggle-33eaa513-12:var(--csstools-color-scheme--light) var(--color-gray-20);background-color:var(--csstools-light-dark-toggle-33eaa513-12,var(--color-gray-80))}@supports (color:light-dark(red,red)){.button[data-variant=plain]:hover{background-color:light-dark(var(--color-gray-80),var(--color-gray-20))}}.button[data-variant=plain][data-action=positive]{--csstools-light-dark-toggle-33eaa513-13:var(--csstools-color-scheme--light) var(--color-green-80);color:var(--csstools-light-dark-toggle-33eaa513-13,var(--color-green-50))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=positive]{color:light-dark(var(--color-green-50),var(--color-green-80))}}.button[data-variant=plain][data-action=positive]:hover{--csstools-light-dark-toggle-33eaa513-14:var(--csstools-color-scheme--light) var(--color-green-10);background-color:var(--csstools-light-dark-toggle-33eaa513-14,var(--color-green-90))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=positive]:hover{background-color:light-dark(var(--color-green-90),var(--color-green-10))}}.button[data-variant=plain][data-action=negative]{--csstools-light-dark-toggle-33eaa513-15:var(--csstools-color-scheme--light) var(--color-red-80);color:var(--csstools-light-dark-toggle-33eaa513-15,var(--color-red-50))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=negative]{color:light-dark(var(--color-red-50),var(--color-red-80))}}.button[data-variant=plain][data-action=negative]:hover{--csstools-light-dark-toggle-33eaa513-16:var(--csstools-color-scheme--light) var(--color-red-10);background-color:var(--csstools-light-dark-toggle-33eaa513-16,var(--color-red-90))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=negative]:hover{background-color:light-dark(var(--color-red-90),var(--color-red-10))}}.button[disabled]{--csstools-light-dark-toggle-33eaa513-17:var(--csstools-color-scheme--light) var(--color-gray-60)!important;color:var(--csstools-light-dark-toggle-33eaa513-17,var(--color-gray-40))!important;cursor:default;--csstools-light-dark-toggle-33eaa513-18:var(--csstools-color-scheme--light) var(--color-gray-20)!important;background-color:var(--csstools-light-dark-toggle-33eaa513-18,var(--color-gray-80))!important;border-color:#0000}@supports (color:light-dark(red,red)){.button[disabled]{background-color:light-dark(var(--color-gray-80),var(--color-gray-20))!important;color:light-dark(var(--color-gray-40),var(--color-gray-60))!important}}.button .icon{display:flex}.button svg{height:1.25em;width:1.25em}.button .label{padding-block:.125em;padding-inline:.0625em}:host{display:inline-flex;vertical-align:middle}.button{box-sizing:border-box;height:100%;width:100%}</style> <button class="button" aria-labelledby="label-zuhshizohni" data-variant="secondary" data-action="negative" part="button"> <span class="icon" part="icon"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"><path d="M17 14V2M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88"></path></svg></span> <span id="label-zuhshizohni" class="label" part="label"><slot></slot></span>  </button> </template> 否 </mdn-button> </div> </fieldset></template></mdn-content-feedback> <a class="article-footer__contribute" href="/en-US/docs/MDN/Community/Getting_started">瞭解如何貢獻</a> <p class="article-footer__last-modified">本頁面最後由<a href="/en-US/docs/Web/API/Window/open">MDN 貢獻者</a>於<time datetime="2025-09-18T15:45:07.000Z">2025 年 9 月 18 日</time>修改。</p> <div class="article-footer__links"> <a class="external" href="https://github.com/mdn/content/blob/main/files/en-us/web/api/window/open/index.md?plain=1" title="資料夾：⁨en-us/web/api/window/open⁩（在新標籤頁中開啟）" target="_blank" rel="noopener">在 GitHub 上檢視此頁面</a> • <a class="external" href="https://github.com/mdn/content/issues/new?template=page-report.yml&mdn-url=https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FWindow%2Fopen&metadata=%3C%21--+Do+not+make+changes+below+this+line+--%3E%0A%3Cdetails%3E%0A%3Csummary%3EPage+report+details%3C%2Fsummary%3E%0A%0A*+Folder%3A+%60en-us%2Fweb%2Fapi%2Fwindow%2Fopen%60%0A*+MDN+URL%3A+https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FWindow%2Fopen%0A*+GitHub+URL%3A+https%3A%2F%2Fgithub.com%2Fmdn%2Fcontent%2Fblob%2Fmain%2Ffiles%2Fen-us%2Fweb%2Fapi%2Fwindow%2Fopen%2Findex.md%0A*+Last+commit%3A+https%3A%2F%2Fgithub.com%2Fmdn%2Fcontent%2Fcommit%2F2ccbd062264d0a2a34f185a3386cb272f42c50f5%0A*+Document+last+modified%3A+2025-09-18T15%3A45%3A07.000Z%0A%0A%3C%2Fdetails%3E" title="這將帶您到 GitHub 提交新問題。" target="_blank" rel="noopener">報告此內容的問題</a></div> </div> </section> </div> </main> <aside class="reference-layout__sidebar" id="main-sidebar"> <nav class="left-sidebar"> <div class="left-sidebar__header"> <mdn-sidebar-filter><template shadowroot="open" shadowrootmode="open"><style>.visually-hidden{border:0!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}*,:after,:before{box-sizing:border-box}button,input,select,textarea{font:inherit}button{color:inherit;cursor:pointer}img{height:auto;max-width:100%}a{color:var(--color-link-normal)}[hidden]{display:none!important}:host{align-items:center;display:grid;grid-template-areas:"icon input button";grid-template-columns:2.2rem 1fr min-content}.icon{background-color:var(--color-text-secondary);content:"";grid-area:icon;height:1.25rem;justify-self:center;margin-left:.4rem;-webkit-mask-image:url(/static/ssr/filter.b77a4ccbfb57e2ef.svg);mask-image:url(/static/ssr/filter.b77a4ccbfb57e2ef.svg);-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.input{background-color:initial;border:1px solid var(--color-border-primary);border-radius:var(--radius-full);grid-area:1/1/-1/-1;margin:0;padding:.3rem 4.2rem .3rem 2.2rem;width:100%}.input::placeholder{color:var(--color-text-secondary)}.input:focus{border-color:#0000}.counter{background-color:var(--color-background-yellow);border-radius:var(--radius-normal);font-size:var(--font-size-small);grid-area:input;justify-self:end;line-height:var(--font-line-ui);padding:.25rem;white-space:nowrap}.button{grid-area:button}.button::part(button){border-radius:50%}.button::part(button):hover{background-color:initial}:placeholder-shown~.button{visibility:hidden}</style> <label class="icon" for="input"> <span class="visually-hidden">篩選側邊欄</span> </label> <input id="input" autocomplete="off" class="input" type="text" placeholder="Filter" value="" />  <mdn-button class="button" variant="plain" icon-only="" label="Clear filter input" defer-hydration=""><template shadowroot="open" shadowrootmode="open"><style>.button{align-items:center;background-color:initial;border:1px solid #0000;border-radius:.25rem;color:var(--color-text-primary);column-gap:.3125em;cursor:pointer;display:inline-flex;font-family:var(--font-family-text);font-size:.875em;font-weight:450;justify-content:center;line-height:var(--font-line-ui);margin:0;padding:.5em;-webkit-text-decoration:none;text-decoration:none;vertical-align:middle}.button[data-variant=primary]{--csstools-light-dark-toggle-33eaa513-0:var(--csstools-color-scheme--light) var(--color-black);color:var(--csstools-light-dark-toggle-33eaa513-0,var(--color-white));--csstools-light-dark-toggle-33eaa513-1:var(--csstools-color-scheme--light) var(--color-white);background-color:var(--csstools-light-dark-toggle-33eaa513-1,var(--color-black))}@supports (color:light-dark(red,red)){.button[data-variant=primary]{background-color:light-dark(var(--color-black),var(--color-white));color:light-dark(var(--color-white),var(--color-black))}}.button[data-variant=primary]:hover{--csstools-light-dark-toggle-33eaa513-2:var(--csstools-color-scheme--light) var(--color-gray-80);background-color:var(--csstools-light-dark-toggle-33eaa513-2,var(--color-gray-20))}@supports (color:light-dark(red,red)){.button[data-variant=primary]:hover{background-color:light-dark(var(--color-gray-20),var(--color-gray-80))}}.button[data-variant=primary][data-action=positive]{color:var(--color-white);--csstools-light-dark-toggle-33eaa513-3:var(--csstools-color-scheme--light) var(--color-green-20);background-color:var(--csstools-light-dark-toggle-33eaa513-3,var(--color-green-50))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=positive]{background-color:light-dark(var(--color-green-50),var(--color-green-20))}}.button[data-variant=primary][data-action=positive]:hover{--csstools-light-dark-toggle-33eaa513-4:var(--csstools-color-scheme--light) var(--color-green-50);background-color:var(--csstools-light-dark-toggle-33eaa513-4,var(--color-green-20))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=positive]:hover{background-color:light-dark(var(--color-green-20),var(--color-green-50))}}.button[data-variant=primary][data-action=negative]{color:var(--color-white);--csstools-light-dark-toggle-33eaa513-5:var(--csstools-color-scheme--light) var(--color-red-20);background-color:var(--csstools-light-dark-toggle-33eaa513-5,var(--color-red-50))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=negative]{background-color:light-dark(var(--color-red-50),var(--color-red-20))}}.button[data-variant=primary][data-action=negative]:hover{--csstools-light-dark-toggle-33eaa513-6:var(--csstools-color-scheme--light) var(--color-red-50);background-color:var(--csstools-light-dark-toggle-33eaa513-6,var(--color-red-20))}@supports (color:light-dark(red,red)){.button[data-variant=primary][data-action=negative]:hover{background-color:light-dark(var(--color-red-20),var(--color-red-50))}}.button[data-variant=secondary]{border-color:currentcolor}.button[data-variant=secondary]:hover{--csstools-light-dark-toggle-33eaa513-7:var(--csstools-color-scheme--light) var(--color-gray-20);background-color:var(--csstools-light-dark-toggle-33eaa513-7,var(--color-gray-80))}@supports (color:light-dark(red,red)){.button[data-variant=secondary]:hover{background-color:light-dark(var(--color-gray-80),var(--color-gray-20))}}.button[data-variant=secondary][data-action=positive]{--csstools-light-dark-toggle-33eaa513-8:var(--csstools-color-scheme--light) var(--color-green-80);color:var(--csstools-light-dark-toggle-33eaa513-8,var(--color-green-50))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=positive]{color:light-dark(var(--color-green-50),var(--color-green-80))}}.button[data-variant=secondary][data-action=positive]:hover{--csstools-light-dark-toggle-33eaa513-9:var(--csstools-color-scheme--light) var(--color-green-10);background-color:var(--csstools-light-dark-toggle-33eaa513-9,var(--color-green-90))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=positive]:hover{background-color:light-dark(var(--color-green-90),var(--color-green-10))}}.button[data-variant=secondary][data-action=negative]{--csstools-light-dark-toggle-33eaa513-10:var(--csstools-color-scheme--light) var(--color-red-80);color:var(--csstools-light-dark-toggle-33eaa513-10,var(--color-red-50))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=negative]{color:light-dark(var(--color-red-50),var(--color-red-80))}}.button[data-variant=secondary][data-action=negative]:hover{--csstools-light-dark-toggle-33eaa513-11:var(--csstools-color-scheme--light) var(--color-red-10);background-color:var(--csstools-light-dark-toggle-33eaa513-11,var(--color-red-90))}@supports (color:light-dark(red,red)){.button[data-variant=secondary][data-action=negative]:hover{background-color:light-dark(var(--color-red-90),var(--color-red-10))}}.button[data-variant=plain]:hover{--csstools-light-dark-toggle-33eaa513-12:var(--csstools-color-scheme--light) var(--color-gray-20);background-color:var(--csstools-light-dark-toggle-33eaa513-12,var(--color-gray-80))}@supports (color:light-dark(red,red)){.button[data-variant=plain]:hover{background-color:light-dark(var(--color-gray-80),var(--color-gray-20))}}.button[data-variant=plain][data-action=positive]{--csstools-light-dark-toggle-33eaa513-13:var(--csstools-color-scheme--light) var(--color-green-80);color:var(--csstools-light-dark-toggle-33eaa513-13,var(--color-green-50))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=positive]{color:light-dark(var(--color-green-50),var(--color-green-80))}}.button[data-variant=plain][data-action=positive]:hover{--csstools-light-dark-toggle-33eaa513-14:var(--csstools-color-scheme--light) var(--color-green-10);background-color:var(--csstools-light-dark-toggle-33eaa513-14,var(--color-green-90))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=positive]:hover{background-color:light-dark(var(--color-green-90),var(--color-green-10))}}.button[data-variant=plain][data-action=negative]{--csstools-light-dark-toggle-33eaa513-15:var(--csstools-color-scheme--light) var(--color-red-80);color:var(--csstools-light-dark-toggle-33eaa513-15,var(--color-red-50))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=negative]{color:light-dark(var(--color-red-50),var(--color-red-80))}}.button[data-variant=plain][data-action=negative]:hover{--csstools-light-dark-toggle-33eaa513-16:var(--csstools-color-scheme--light) var(--color-red-10);background-color:var(--csstools-light-dark-toggle-33eaa513-16,var(--color-red-90))}@supports (color:light-dark(red,red)){.button[data-variant=plain][data-action=negative]:hover{background-color:light-dark(var(--color-red-90),var(--color-red-10))}}.button[disabled]{--csstools-light-dark-toggle-33eaa513-17:var(--csstools-color-scheme--light) var(--color-gray-60)!important;color:var(--csstools-light-dark-toggle-33eaa513-17,var(--color-gray-40))!important;cursor:default;--csstools-light-dark-toggle-33eaa513-18:var(--csstools-color-scheme--light) var(--color-gray-20)!important;background-color:var(--csstools-light-dark-toggle-33eaa513-18,var(--color-gray-80))!important;border-color:#0000}@supports (color:light-dark(red,red)){.button[disabled]{background-color:light-dark(var(--color-gray-80),var(--color-gray-20))!important;color:light-dark(var(--color-gray-40),var(--color-gray-60))!important}}.button .icon{display:flex}.button svg{height:1.25em;width:1.25em}.button .label{padding-block:.125em;padding-inline:.0625em}:host{display:inline-flex;vertical-align:middle}.button{box-sizing:border-box;height:100%;width:100%}</style> <button class="button" aria-labelledby="label-z89gf8is0zc" data-variant="plain" part="button"> <span class="icon" part="icon"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"><path d="M18 6 6 18M6 6l12 12"></path></svg></span> <span id="label-z89gf8is0zc" class="label" hidden="" part="label"><slot></slot></span>  </button> </template></mdn-button> </template></mdn-sidebar-filter> </div> <div class="left-sidebar__content"><ol><li class="section"><a href="/en-US/docs/Web/API/Window"><code>Window</code></a></li><li><details open=""><summary><span>例項屬性</span></summary><ol><li><a href="/en-US/docs/Web/API/Window/caches"><code>caches</code></a></li><li><a href="/en-US/docs/Web/API/Window/closed"><code>closed</code></a></li><li><a href="/en-US/docs/Web/API/Window/cookieStore"><code>cookieStore</code></a></li><li><a href="/en-US/docs/Web/API/Window/credentialless"><code>credentialless</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/crossOriginIsolated"><code>crossOriginIsolated</code></a></li><li><a href="/en-US/docs/Web/API/Window/crypto"><code>crypto</code></a></li><li><a href="/en-US/docs/Web/API/Window/customElements"><code>customElements</code></a></li><li><a href="/en-US/docs/Web/API/Window/devicePixelRatio"><code>devicePixelRatio</code></a></li><li><a href="/en-US/docs/Web/API/Window/document"><code>document</code></a></li><li><a href="/en-US/docs/Web/API/Window/documentPictureInPicture"><code>documentPictureInPicture</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/event"><code>event</code></a><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/external"><code>external</code></a><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/fence"><code>fence</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/frameElement"><code>frameElement</code></a></li><li><a href="/en-US/docs/Web/API/Window/frames"><code>frames</code></a></li><li><a href="/en-US/docs/Web/API/Window/fullScreen"><code>fullScreen</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/history"><code>history</code></a></li><li><a href="/en-US/docs/Web/API/Window/indexedDB"><code>indexedDB</code></a></li><li><a href="/en-US/docs/Web/API/Window/innerHeight"><code>innerHeight</code></a></li><li><a href="/en-US/docs/Web/API/Window/innerWidth"><code>innerWidth</code></a></li><li><a href="/en-US/docs/Web/API/Window/isSecureContext"><code>isSecureContext</code></a></li><li><a href="/en-US/docs/Web/API/Window/launchQueue"><code>launchQueue</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/length"><code>length</code></a></li><li><a href="/en-US/docs/Web/API/Window/localStorage"><code>localStorage</code></a></li><li><a href="/en-US/docs/Web/API/Window/location"><code>location</code></a></li><li><a href="/en-US/docs/Web/API/Window/locationbar"><code>locationbar</code></a></li><li><a href="/en-US/docs/Web/API/Window/menubar"><code>menubar</code></a></li><li><a href="/en-US/docs/Web/API/Window/mozInnerScreenX"><code>mozInnerScreenX</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/mozInnerScreenY"><code>mozInnerScreenY</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/name"><code>name</code></a></li><li><a href="/en-US/docs/Web/API/Window/navigation"><code>navigation</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/navigator"><code>navigator</code></a></li><li><a href="/en-US/docs/Web/API/Window/opener"><code>opener</code></a></li><li><a href="/en-US/docs/Web/API/Window/orientation"><code>orientation</code></a><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/origin"><code>origin</code></a></li><li><a href="/en-US/docs/Web/API/Window/originAgentCluster"><code>originAgentCluster</code></a></li><li><a href="/en-US/docs/Web/API/Window/outerHeight"><code>outerHeight</code></a></li><li><a href="/en-US/docs/Web/API/Window/outerWidth"><code>outerWidth</code></a></li><li><a href="/en-US/docs/Web/API/Window/parent"><code>parent</code></a></li><li><a href="/en-US/docs/Web/API/Window/performance"><code>performance</code></a></li><li><a href="/en-US/docs/Web/API/Window/personalbar"><code>personalbar</code></a></li><li><a href="/en-US/docs/Web/API/Window/scheduler"><code>scheduler</code></a></li><li><a href="/en-US/docs/Web/API/Window/screen"><code>screen</code></a></li><li><a href="/en-US/docs/Web/API/Window/screenLeft"><code>screenLeft</code></a></li><li><a href="/en-US/docs/Web/API/Window/screenTop"><code>screenTop</code></a></li><li><a href="/en-US/docs/Web/API/Window/screenX"><code>screenX</code></a></li><li><a href="/en-US/docs/Web/API/Window/screenY"><code>screenY</code></a></li><li><a href="/en-US/docs/Web/API/Window/scrollbars"><code>scrollbars</code></a></li><li><a href="/en-US/docs/Web/API/Window/scrollMaxX"><code>scrollMaxX</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/scrollMaxY"><code>scrollMaxY</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/scrollX"><code>scrollX</code></a></li><li><a href="/en-US/docs/Web/API/Window/scrollY"><code>scrollY</code></a></li><li><a href="/en-US/docs/Web/API/Window/self"><code>self</code></a></li><li><a href="/en-US/docs/Web/API/Window/sessionStorage"><code>sessionStorage</code></a></li><li><a href="/en-US/docs/Web/API/Window/sharedStorage"><code>sharedStorage</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/speechSynthesis"><code>speechSynthesis</code></a></li><li><a href="/en-US/docs/Web/API/Window/status"><code>status</code></a><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/statusbar"><code>statusbar</code></a></li><li><a href="/en-US/docs/Web/API/Window/toolbar"><code>toolbar</code></a></li><li><a href="/en-US/docs/Web/API/Window/top"><code>top</code></a></li><li><a href="/en-US/docs/Web/API/Window/trustedTypes"><code>trustedTypes</code></a></li><li><a href="/en-US/docs/Web/API/Window/viewport"><code>viewport</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/visualViewport"><code>visualViewport</code></a></li><li><a href="/en-US/docs/Web/API/Window/window"><code>window</code></a></li></ol></details></li><li><details open=""><summary><span>例項方法</span></summary><ol><li><a href="/en-US/docs/Web/API/Window/alert"><code>alert()</code></a></li><li><a href="/en-US/docs/Web/API/Window/atob"><code>atob()</code></a></li><li><a href="/en-US/docs/Web/API/Window/blur"><code>blur()</code></a><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/btoa"><code>btoa()</code></a></li><li><a href="/en-US/docs/Web/API/Window/cancelAnimationFrame"><code>cancelAnimationFrame()</code></a></li><li><a href="/en-US/docs/Web/API/Window/cancelIdleCallback"><code>cancelIdleCallback()</code></a></li><li><a href="/en-US/docs/Web/API/Window/captureEvents"><code>captureEvents()</code></a><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/clearImmediate"><code>clearImmediate()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/clearInterval"><code>clearInterval()</code></a></li><li><a href="/en-US/docs/Web/API/Window/clearTimeout"><code>clearTimeout()</code></a></li><li><a href="/en-US/docs/Web/API/Window/close"><code>close()</code></a></li><li><a href="/en-US/docs/Web/API/Window/confirm"><code>confirm()</code></a></li><li><a href="/en-US/docs/Web/API/Window/createImageBitmap"><code>createImageBitmap()</code></a></li><li><a href="/en-US/docs/Web/API/Window/dump"><code>dump()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/fetch"><code>fetch()</code></a></li><li><a href="/en-US/docs/Web/API/Window/fetchLater"><code>fetchLater()</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/find"><code>find()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/focus"><code>focus()</code></a></li><li><a href="/en-US/docs/Web/API/Window/getComputedStyle"><code>getComputedStyle()</code></a></li><li><a href="/en-US/docs/Web/API/Window/getDefaultComputedStyle"><code>getDefaultComputedStyle()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/getScreenDetails"><code>getScreenDetails()</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/getSelection"><code>getSelection()</code></a></li><li><a href="/en-US/docs/Web/API/Window/matchMedia"><code>matchMedia()</code></a></li><li><a href="/en-US/docs/Web/API/Window/moveBy"><code>moveBy()</code></a></li><li><a href="/en-US/docs/Web/API/Window/moveTo"><code>moveTo()</code></a></li><li><em><a href="/en-US/docs/Web/API/Window/open" aria-current="page"><code>open()</code></a></em></li><li><a href="/en-US/docs/Web/API/Window/postMessage"><code>postMessage()</code></a></li><li><a href="/en-US/docs/Web/API/Window/print"><code>print()</code></a></li><li><a href="/en-US/docs/Web/API/Window/prompt"><code>prompt()</code></a></li><li><a href="/en-US/docs/Web/API/Window/queryLocalFonts"><code>queryLocalFonts()</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/queueMicrotask"><code>queueMicrotask()</code></a></li><li><a href="/en-US/docs/Web/API/Window/releaseEvents"><code>releaseEvents()</code></a><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/reportError"><code>reportError()</code></a></li><li><a href="/en-US/docs/Web/API/Window/requestAnimationFrame"><code>requestAnimationFrame()</code></a></li><li><a href="/en-US/docs/Web/API/Window/requestFileSystem"><code>requestFileSystem()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/requestIdleCallback"><code>requestIdleCallback()</code></a></li><li><a href="/en-US/docs/Web/API/Window/resizeBy"><code>resizeBy()</code></a></li><li><a href="/en-US/docs/Web/API/Window/resizeTo"><code>resizeTo()</code></a></li><li><a href="/en-US/docs/Web/API/Window/scroll"><code>scroll()</code></a></li><li><a href="/en-US/docs/Web/API/Window/scrollBy"><code>scrollBy()</code></a></li><li><a href="/en-US/docs/Web/API/Window/scrollByLines"><code>scrollByLines()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/scrollByPages"><code>scrollByPages()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/scrollTo"><code>scrollTo()</code></a></li><li><a href="/en-US/docs/Web/API/Window/setImmediate"><code>setImmediate()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/setInterval"><code>setInterval()</code></a></li><li><a href="/en-US/docs/Web/API/Window/setResizable"><code>setResizable()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/setTimeout"><code>setTimeout()</code></a></li><li><a href="/en-US/docs/Web/API/Window/showDirectoryPicker"><code>showDirectoryPicker()</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/showOpenFilePicker"><code>showOpenFilePicker()</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/showSaveFilePicker"><code>showSaveFilePicker()</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/sizeToContent"><code>sizeToContent()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/stop"><code>stop()</code></a></li><li><a href="/en-US/docs/Web/API/Window/structuredClone"><code>structuredClone()</code></a></li><li><a href="/en-US/docs/Web/API/Window/webkitConvertPointFromNodeToPage"><code>webkitConvertPointFromNodeToPage()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/webkitConvertPointFromPageToNode"><code>webkitConvertPointFromPageToNode()</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li></ol></details></li><li><details open=""><summary><span>事件</span></summary><ol><li><a href="/en-US/docs/Web/API/Window/afterprint_event"><code>afterprint</code></a></li><li><a href="/en-US/docs/Web/API/Window/appinstalled_event"><code>appinstalled</code></a></li><li><a href="/en-US/docs/Web/API/Window/beforeinstallprompt_event"><code>beforeinstallprompt</code></a></li><li><a href="/en-US/docs/Web/API/Window/beforeprint_event"><code>beforeprint</code></a></li><li><a href="/en-US/docs/Web/API/Window/beforeunload_event"><code>beforeunload</code></a></li><li><a href="/en-US/docs/Web/API/Window/blur_event"><code>blur</code></a></li><li><a href="/en-US/docs/Web/API/Window/devicemotion_event"><code>devicemotion</code></a></li><li><a href="/en-US/docs/Web/API/Window/deviceorientation_event"><code>deviceorientation</code></a></li><li><a href="/en-US/docs/Web/API/Window/deviceorientationabsolute_event"><code>deviceorientationabsolute</code></a></li><li><a href="/en-US/docs/Web/API/Window/error_event"><code>error</code></a></li><li><a href="/en-US/docs/Web/API/Window/focus_event"><code>focus</code></a></li><li><a href="/en-US/docs/Web/API/Window/gamepadconnected_event"><code>gamepadconnected</code></a></li><li><a href="/en-US/docs/Web/API/Window/gamepaddisconnected_event"><code>gamepaddisconnected</code></a></li><li><a href="/en-US/docs/Web/API/Window/hashchange_event"><code>hashchange</code></a></li><li><a href="/en-US/docs/Web/API/Window/languagechange_event"><code>languagechange</code></a></li><li><a href="/en-US/docs/Web/API/Window/load_event"><code>load</code></a></li><li><a href="/en-US/docs/Web/API/Window/message_event"><code>message</code></a></li><li><a href="/en-US/docs/Web/API/Window/messageerror_event"><code>messageerror</code></a></li><li><a href="/en-US/docs/Web/API/Window/offline_event"><code>offline</code></a></li><li><a href="/en-US/docs/Web/API/Window/online_event"><code>online</code></a></li><li><a href="/en-US/docs/Web/API/Window/orientationchange_event"><code>orientationchange</code></a><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/pagehide_event"><code>pagehide</code></a></li><li><a href="/en-US/docs/Web/API/Window/pagereveal_event"><code>pagereveal</code></a></li><li><a href="/en-US/docs/Web/API/Window/pageshow_event"><code>pageshow</code></a></li><li><a href="/en-US/docs/Web/API/Window/pageswap_event"><code>pageswap</code></a></li><li><a href="/en-US/docs/Web/API/Window/popstate_event"><code>popstate</code></a></li><li><a href="/en-US/docs/Web/API/Window/rejectionhandled_event"><code>rejectionhandled</code></a></li><li><a href="/en-US/docs/Web/API/Window/resize_event"><code>resize</code></a></li><li><a href="/en-US/docs/Web/API/Window/scrollsnapchange_event"><code>scrollsnapchange</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/scrollsnapchanging_event"><code>scrollsnapchanging</code></a><abbr class="icon icon-experimental" title="實驗性。期望將來行為有所改變。"> <span class="visually-hidden">實驗性</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/storage_event"><code>storage</code></a></li><li><a href="/en-US/docs/Web/API/Window/unhandledrejection_event"><code>unhandledrejection</code></a></li><li><a href="/en-US/docs/Web/API/Window/unload_event"><code>unload</code></a><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/vrdisplayactivate_event"><code>vrdisplayactivate</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/vrdisplayconnect_event"><code>vrdisplayconnect</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/vrdisplaydeactivate_event"><code>vrdisplaydeactivate</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/vrdisplaydisconnect_event"><code>vrdisplaydisconnect</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li><li><a href="/en-US/docs/Web/API/Window/vrdisplaypresentchange_event"><code>vrdisplaypresentchange</code></a><abbr class="icon icon-nonstandard" title="非標準。在使用前請檢查跨瀏覽器支援情況。"> <span class="visually-hidden">非標準</span> </abbr><abbr class="icon icon-deprecated" title="已廢棄。不應在新網站中使用。"> <span class="visually-hidden">已廢棄</span> </abbr></li></ol></details></li><li><details open=""><summary><span>繼承</span></summary><ol><li><a href="/en-US/docs/Web/API/EventTarget"><code>EventTarget</code></a></li></ol></details></li></ol></div> </nav> </aside> </div> </div> <div class="page-layout__footer"> <mdn-placement-bottom></mdn-placement-bottom> <footer class="footer"> <div class="footer__mdn"> <div class="footer__intro"> <a class="footer__logo" href="/" aria-label="MDN logo"><svg xmlns="http://www.w3.org/2000/svg" width="83" height="24" viewBox="0 0 83 24"><path d="M9.4 0 2.81 21.17H.12L6.69 0zm2.38 0v21.17H9.4V0h2.4Zm9.27 0-6.56 21.17H11.8L18.36 0zm2.39 0v21.17h-2.4V0zm22.11 16.83h-3.93v-1.27h.87v-3.63c0-.85-.16-1.45-.48-1.82a1.65 1.65 0 0 0-1.3-.52c-.74 0-1.3.25-1.66.78a3 3 0 0 0-.58 1.58v3.59h1.38v1.26h-3.93v-1.26h.87v-3.6c0-.88-.16-1.48-.48-1.83a1.7 1.7 0 0 0-1.29-.52 1.93 1.93 0 0 0-1.65.75 2.85 2.85 0 0 0-.58 1.6v3.62h1.59v1.27h-4.64v-1.27h1.37V9.75h-1.4V8.46h3.08v1.47c.28-.48.62-.87 1.08-1.2a3 3 0 0 1 1.68-.45c.67 0 1.22.16 1.73.48.5.32.85.8 1.03 1.47.25-.57.62-1.03 1.13-1.4.5-.37 1.1-.55 1.81-.55.8 0 1.5.25 2.05.75.55.51.85 1.3.85 2.35v4.18h1.4zm9.77 0H52.3v-1.66c-.27.51-.66.95-1.13 1.29-.56.4-1.23.59-1.9.55-1.11 0-2-.37-2.67-1.12a4.4 4.4 0 0 1-1-3.06c0-1.15.3-2.2.93-3.15.6-.94 1.58-1.43 2.94-1.43s2.25.5 2.83 1.5V5.22h-2V3.93h3.63v11.63h1.38v1.27Zm-3.06-3.86v-1.02a2.28 2.28 0 0 0-.73-1.67 2.4 2.4 0 0 0-1.66-.65 2.18 2.18 0 0 0-1.88.9 3.63 3.63 0 0 0-.65 2.2c0 .95.23 1.68.7 2.19.45.5 1.03.76 1.7.76.73 0 1.33-.3 1.79-.88.48-.6.71-1.21.73-1.83m14.14 3.86h-4.43v-1.27h1.37v-3.63c0-.85-.16-1.45-.5-1.82a1.68 1.68 0 0 0-1.31-.52c-.71 0-1.29.23-1.7.69a2.52 2.52 0 0 0-.67 1.6v3.66h1.38v1.26H56.1v-1.26h1.38v-5.8h-1.42V8.47h3.12V9.9c.6-1.06 1.57-1.6 2.92-1.6.83 0 1.54.26 2.12.77.57.5.85 1.28.85 2.34v4.19h1.38v1.24h-.05Zm1.31 5.15H83V24H67.71z"></path></svg></a> <p>你的更美好網際網路藍圖。</p> </div> <ul class="footer__socials"> <li> <a href="https://github.com/mdn/" aria-label="MDN on GitHub" data-icon="github"></a> </li> <li> <a href="https://bsky.app/profile/developer.mozilla.org" aria-label="MDN on Bluesky" data-icon="bluesky"></a> </li> <li> <a href="https://x.com/mozdevnet" aria-label="MDN on X" data-icon="x"></a> </li> <li> <a href="https://mastodon.social/@mdn" aria-label="MDN on Mastodon" data-icon="mastodon"></a> </li> <li> <a href="/en-US/blog/rss.xml" aria-label="MDN blog RSS feed" data-icon="rss"></a> </li> </ul> <dl class="footer__links"> <dt>MDN</dt> <dd> <ul> <li> <a href="/en-US/about" class="">關於</a> </li> <li> <a href="/en-US/blog/" class="">部落格</a> </li> <li> <a href="https://www.mozilla.org/en-US/careers/listings/" class="external">Mozilla 職業</a> </li> <li> <a href="/en-US/advertising" class="">與我們一起做廣告</a> </li> <li> <a href="/en-US/plus" class="">MDN Plus</a> </li> <li> <a href="https://support.mozilla.org/products/mdn-plus" class="external">產品幫助</a> </li> </ul> </dd> </dl> <dl class="footer__links"> <dt>貢獻</dt> <dd> <ul> <li> <a href="/en-US/community" class="">MDN 社群</a> </li> <li> <a href="/en-US/docs/MDN/Community" class="">社群資源</a> </li> <li> <a href="/en-US/docs/MDN/Writing_guidelines" class="">寫作指南</a> </li> <li> <a href="/discord" class="external">MDN Discord</a> </li> <li> <a href="https://github.com/mdn" class="external">GitHub 上的 MDN</a> </li> </ul> </dd> </dl> <dl class="footer__links"> <dt>開發者</dt> <dd> <ul> <li> <a href="/en-US/docs/Web" class="">Web 技術</a> </li> <li> <a href="/en-US/docs/Learn_web_development" class="">學習 Web 開發</a> </li> <li> <a href="/en-US/docs/MDN/Guides" class="">指南</a> </li> <li> <a href="/en-US/docs/MDN/Tutorials" class="">教程</a> </li> <li> <a href="/en-US/docs/Glossary" class="">術語表</a> </li> <li> <a href="https://hacks.mozilla.org/" class="external">Hacks 部落格</a> </li> </ul> </dd> </dl> </div> <div class="footer__mozilla"> <a class="footer__logo" href="https://www.mozilla.org/" aria-label="Mozilla logo"><svg xmlns="http://www.w3.org/2000/svg" width="128" height="30" viewBox="0 0 256 60"><path d="m13.32 22.1 5.1 24.3h2.1l5.1-24.3H39.3v37.34h-7.26V28.46h-2.1l-6.96 30.98h-7.02L9.02 28.46h-2.1v31H-.35V22.1h13.66Zm45.12 8.74c8.73 0 13.8 5.15 13.8 14.57S67.14 60 58.44 60c-8.73 0-13.8-5.17-13.8-14.59 0-9.43 5.07-14.57 13.8-14.57m0 23.34c4.1 0 6.16-2.1 6.16-6.73v-4.12c0-4.62-2.06-6.73-6.16-6.73s-6.15 2.1-6.15 6.73v4.12c0 4.63 2.05 6.73 6.15 6.73m17.68-.14 14.82-17.26H76.32v-5.41h23.31v5.4L84.84 54.05h15.03v5.4H76.13v-5.41Zm28.07-22.67h10.7v28.07h-7.25V36.77h-3.48v-5.4zm3.44-9.27h7.26v5.4h-7.25v-5.4Zm12.62 0h10.72v37.34h-7.24V27.5h-3.48zm16.08 0h10.7v37.34h-7.25V27.5h-3.48v-5.4zm27.8 8.74c4.24 0 7.08 2.05 7.87 5.63h2.1v-5.1h8.88v5.4h-3.47v17.28h3.47v5.4h-4.25c-3 0-4.63-1.63-4.63-4.62v-.48H172c-.78 3.58-3.63 5.63-7.88 5.63-6.68 0-11.4-5.59-11.4-14.58 0-9 4.72-14.55 11.4-14.55m2.2 23.34c4.1 0 5.93-2.1 5.93-6.73v-4.12c0-4.62-1.82-6.73-5.94-6.73-3.99 0-5.92 2.1-5.92 6.73v4.13c0 4.62 1.92 6.72 5.93 6.72m46.28 5.27h-7.26V0h7.26zm6.3-28.41h30.8v-2.1l-20.4-7.32v-5.88l20.4-7.33v-2.1h-24.27V0h30.79v12l-16.62 5.63v2.11l16.61 5.64v12H218.9zm0-24.73h6.5v6.52h-6.5z"></path></svg></a> <ul> <li> <a href="https://www.mozilla.org/privacy/websites/" class="external">網站隱私宣告</a> </li> <li> <a href="https://www.mozilla.org/en-US/privacy/websites/data-preferences/" class="external">遙測設定</a> </li> <li> <a href="https://www.mozilla.org/about/legal/terms/mozilla" class="external">法律</a> </li> <li> <a href="https://www.mozilla.org/about/governance/policies/participation/" class="external">社群參與指南</a> </li> </ul> <p>請訪問 <a href="https://www.mozilla.org/">Mozilla 公司</a>的非營利父級組織 <a href="https://foundation.mozilla.org/">Mozilla 基金會</a>。<br />此內容的部分版權 ©1998–⁨2025⁩ 歸各 mozilla.org 貢獻者所有。內容受 <a href="/docs/MDN/Writing_guidelines/Attrib_copyright_license">知識共享許可協議</a> 的約束。</p> </div> </footer> </div> <div class="footer" style="padding: 2em 1em; text-align: center;"> © <script>document.write(new Date().getFullYear())</script> <i><script>document.write(location.host)</script></i>. Content available under <a href="/docs/MDN/Writing_guidelines/Attrib_copyright_license">a Creative Commons license</a>. </div></body></html>