diff options
Diffstat (limited to 'files/th/web/api')
| -rw-r--r-- | files/th/web/api/bluetooth/index.html | 77 | ||||
| -rw-r--r-- | files/th/web/api/bluetooth/onavailabilitychanged/index.html | 46 | ||||
| -rw-r--r-- | files/th/web/api/cachestorage/index.html | 189 | ||||
| -rw-r--r-- | files/th/web/api/geolocation/index.html | 142 | ||||
| -rw-r--r-- | files/th/web/api/geolocation_api/index.html | 92 | ||||
| -rw-r--r-- | files/th/web/api/geolocation_api/using_the_geolocation_api/index.html | 170 | ||||
| -rw-r--r-- | files/th/web/api/history_api/index.html | 249 | ||||
| -rw-r--r-- | files/th/web/api/index.html | 14 | ||||
| -rw-r--r-- | files/th/web/api/indexeddb_api/index.html | 308 | ||||
| -rw-r--r-- | files/th/web/api/location/index.html | 217 | ||||
| -rw-r--r-- | files/th/web/api/server-sent_events/index.html | 72 | ||||
| -rw-r--r-- | files/th/web/api/webgl_api/index.html | 253 | ||||
| -rw-r--r-- | files/th/web/api/websockets_api/index.html | 101 | ||||
| -rw-r--r-- | files/th/web/api/window/index.html | 689 | ||||
| -rw-r--r-- | files/th/web/api/xmlhttprequest/index.html | 186 | ||||
| -rw-r--r-- | files/th/web/api/xrreferencespacetype/index.html | 78 |
16 files changed, 0 insertions, 2883 deletions
diff --git a/files/th/web/api/bluetooth/index.html b/files/th/web/api/bluetooth/index.html deleted file mode 100644 index 74a1f52188..0000000000 --- a/files/th/web/api/bluetooth/index.html +++ /dev/null @@ -1,77 +0,0 @@ ---- -title: Bluetooth -slug: Web/API/Bluetooth -tags: - - API - - Bluetooth - - Experimental - - Interface - - NeedsTranslation - - Reference - - TopicStub - - Web Bluetooth API -translation_of: Web/API/Bluetooth ---- -<p>{{APIRef("Bluetooth API")}}{{securecontext_header}}{{SeeCompatTable}}</p> - -<p>The <strong><code>Bluetooth</code></strong> interface of the <a href="/en-US/docs/Web/API/Web_Bluetooth_API">Web Bluetooth API</a> returns a {{jsxref("Promise")}} to a {{domxref("BluetoothDevice")}} object with the specified options.</p> - -<h2 id="Interface">Interface</h2> - -<pre class="syntaxbox">interface Bluetooth : EventTarget { - [SecureContext] Promise<boolean> getAvailability(); - [SecureContext] attribute EventHandler onavailabilitychanged; - [SecureContext, SameObject] readonly attribute BluetoothDevice? referringDevice; - [SecureContext] Promise<BluetoothDevice> requestDevice(optional RequestDeviceOptions options); -}; -Bluetooth implements BluetoothDeviceEventHandlers; -Bluetooth implements CharacteristicEventHandlers; -Bluetooth implements ServiceEventHandlers;</pre> - -<h2 id="Properties">Properties</h2> - -<p><em>Inherits properties from its parent {{domxref("EventTarget")}}.</em></p> - -<dl> - <dt>{{domxref("Bluetooth.referringDevice")}} {{readonlyinline}}</dt> - <dd>Returns a reference to the device, if any, from which the user opened the current page. For example, an Eddystone beacon might advertise a URL, which the user agent allows the user to open. A BluetoothDevice representing the beacon would be available through <code>navigator.bluetooth.referringDevice</code>.</dd> -</dl> - -<h3 id="Events">Events</h3> - -<dl> - <dt>{{domxref("Bluetooth.onavailabilitychanged")}}</dt> - <dd>An event handler that runs when an event of type {{event("availabilitychanged")}} has fired.</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<dl> - <dt>{{domxref("Bluetooth.getAvailability()")}}</dt> - <dd>Returns a {{jsxref("Promise")}} that resolved to a {{jsxref("Boolean")}} indicating whether the user-agent has the ability to support Bluetooth. Some user-agents let the user configure an option that affects what is returned by this value. If this option is set, that is the value returned by this method.</dd> - <dt>{{domxref("Bluetooth.requestDevice()")}}</dt> - <dd>Returns a {{jsxref("Promise")}} to a {{domxref("BluetoothDevice")}} object with the specified options.</dd> -</dl> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('Web Bluetooth', '#bluetooth', 'Bluetooth')}}</td> - <td>{{Spec2('Web Bluetooth')}}</td> - <td>Initial definition.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - - - -<p>{{Compat("api.Bluetooth")}}</p> diff --git a/files/th/web/api/bluetooth/onavailabilitychanged/index.html b/files/th/web/api/bluetooth/onavailabilitychanged/index.html deleted file mode 100644 index 74e6881ee0..0000000000 --- a/files/th/web/api/bluetooth/onavailabilitychanged/index.html +++ /dev/null @@ -1,46 +0,0 @@ ---- -title: Bluetooth.onavailabilitychanged -slug: Web/API/Bluetooth/onavailabilitychanged -translation_of: Web/API/Bluetooth/onavailabilitychanged ---- -<p>{{APIRef("Bluetooth API")}}{{securecontext_header}}{{SeeCompatTable}}</p> - -<p><span class="seoSummary">The <strong><code>onavailabilitychanged</code></strong> property of the {{DOMxRef("Bluetooth")}} interface is an {{DOMxRef("EventHandler")}} that processes <code>availabilitychanged</code> events that fire when the Bluetooth system as a whole becomes available or unavailable to the {{Glossary("User Agent")}}.</span></p> - -<h2 id="Syntax">Syntax</h2> - -<pre class="syntaxbox"><em>Bluetooth</em>.onavailabilitychanged = <em>functionRef</em>; -</pre> - -<h3 id="Value">Value</h3> - -<p><code>functionRef</code> is the handler function to be called when the Bluetooth <code>availabilitychanged</code> event fires.</p> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName("Web Bluetooth", "#bluetooth", "Bluetooth")}}</td> - <td>{{Spec2("Web Bluetooth")}}</td> - <td>Initial definition.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<div class="hidden"><font><font>ตารางความเข้ากันได้ในหน้านี้สร้างขึ้นจากข้อมูลที่มีโครงสร้าง </font><font>หากคุณต้องการมีส่วนร่วมกับข้อมูลโปรดตรวจสอบ</font></font><a href="https://github.com/mdn/browser-compat-data"><font><font>https://github.com/mdn/browser-compat-data</font></font></a><font><font>และส่งคำขอดึง</font></font></div> - -<p><font><font>{{compat ( "api.Bluetooth.onavailabilitychanged")}}</font></font></p> - -<h2 id="ดูสิ่งนี้ด้วย"><font><font>ดูสิ่งนี้ด้วย</font></font></h2> - -<ul> - <li><font><font>{{DOMxRef ( "Bluetooth.getAvailability")}}</font></font></li> -</ul> diff --git a/files/th/web/api/cachestorage/index.html b/files/th/web/api/cachestorage/index.html deleted file mode 100644 index 1debf49bb0..0000000000 --- a/files/th/web/api/cachestorage/index.html +++ /dev/null @@ -1,189 +0,0 @@ ---- -title: CacheStorage -slug: Web/API/CacheStorage -translation_of: Web/API/CacheStorage ---- -<p><font><font>{{APIRef ("Service Workers API")}}</font></font></p> - -<p><strong><code>CacheStorage</code></strong><font><font>อินเตอร์เฟซที่แสดงให้เห็นถึงการจัดเก็บข้อมูลสำหรับ {{domxref ( "แคช")}} วัตถุ</font></font></p> - -<p><font><font>อินเทอร์เฟซ:</font></font></p> - -<ul> - <li><font><font>จัดเตรียมไดเร็กทอรีหลักของแคชที่มีชื่อทั้งหมดซึ่งสามารถเข้าถึงได้โดย {{domxref ("ServiceWorker")}} หรือผู้ปฏิบัติงานประเภทอื่นหรือขอบเขต {{domxref ("window")}} (คุณไม่ จำกัด เฉพาะ โดยใช้กับพนักงานบริการแม้ว่าข้อมูลจำเพาะ {{SpecName ('Service Workers')}} จะกำหนดก็ตาม)</font></font> - - <div class="note"><strong><font><font>หมายเหตุ</font></font></strong><font><font> : </font></font><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=1026063"><font><font>Chrome และ Safari 7เพียงเปิดเผย `CacheStorage` กับบริบทหน้าต่างผ่าน </font></font></a><font><font>HTTPS </font><font>{{domxref ("window.caches")}} จะไม่ถูกกำหนดเว้นแต่จะมีการกำหนดค่าใบรับรอง SSL</font></font></div> - </li> - <li><font><font>รักษาการแมปชื่อสตริงกับออบเจ็กต์ {{domxref ("Cache")}} ที่เกี่ยวข้อง</font></font></li> -</ul> - -<p><font><font>ใช้ {{domxref ("CacheStorage.open ()")}} เพื่อรับอินสแตนซ์ {{domxref ("Cache")}}</font></font></p> - -<p>Use {{domxref("CacheStorage.match()")}} to check if a given {{domxref("Request")}} is a key in any of the {{domxref("Cache")}} objects that the <code>CacheStorage</code> object tracks.</p> - -<p>You can access <code>CacheStorage</code> through the global {{domxref("WindowOrWorkerGlobalScope.caches", "caches")}} property.</p> - -<div class="note"><strong>Note</strong>: CacheStorage always rejects with a <code>SecurityError</code> on untrusted origins (i.e. those that aren't using HTTPS, although this definition will likely become more complex in the future.) When testing, you can get around this by checking the "Enable Service Workers over HTTP (when toolbox is open)" option in the Firefox Devtools options/gear menu.</div> - -<div class="note"><strong>Note</strong>: {{domxref("CacheStorage.match()")}} is a convenience method. Equivalent functionality to match a cache entry can be implemented by returning an array of cache names from {{domxref("CacheStorage.keys()")}}, opening each cache with {{domxref("CacheStorage.open()")}}, and matching the one you want with {{domxref("Cache.match()")}}.</div> - -<h2 id="Methods">Methods</h2> - -<dl> - <dt>{{domxref("CacheStorage.match()")}}</dt> - <dd>Checks if a given {{domxref("Request")}} is a key in any of the {{domxref("Cache")}} objects that the {{domxref("CacheStorage")}} object tracks, and returns a {{jsxref("Promise")}} that resolves to that match.</dd> - <dt>{{domxref("CacheStorage.has()")}}</dt> - <dd>Returns a {{jsxref("Promise")}} that resolves to <code>true</code> if a {{domxref("Cache")}} object matching the <code>cacheName</code> exists.</dd> - <dt>{{domxref("CacheStorage.open()")}}</dt> - <dd>Returns a {{jsxref("Promise")}} that resolves to the {{domxref("Cache")}} object matching the <code>cacheName</code> (a new cache is created if it doesn't already exist.)</dd> - <dt>{{domxref("CacheStorage.delete()")}}</dt> - <dd>Finds the {{domxref("Cache")}} object matching the <code>cacheName</code>, and if found, deletes the {{domxref("Cache")}} object and returns a {{jsxref("Promise")}} that resolves to <code>true</code>. If no {{domxref("Cache")}} object is found, it resolves to <code>false</code>.</dd> - <dt>{{domxref("CacheStorage.keys()")}}</dt> - <dd>Returns a {{jsxref("Promise")}} that will resolve with an array containing strings corresponding to all of the named {{domxref("Cache")}} objects tracked by the {{domxref("CacheStorage")}}. Use this method to iterate over a list of all the {{domxref("Cache")}} objects.</dd> -</dl> - -<h2 id="Examples">Examples</h2> - -<p>This code snippet is from the MDN <a href="https://github.com/mdn/sw-test/">sw-test example</a> (see <a href="https://mdn.github.io/sw-test/">sw-test running live</a>.) This service worker script waits for an {{domxref("InstallEvent")}} to fire, then runs {{domxref("ExtendableEvent.waitUntil","waitUntil")}} to handle the install process for the app. This consists of calling {{domxref("CacheStorage.open")}} to create a new cache, then using {{domxref("Cache.addAll")}} to add a series of assets to it.</p> - -<p>In the second code block, we wait for a {{domxref("FetchEvent")}} to fire. We construct a custom response like so:</p> - -<ol> - <li>Check whether a match for the request is found in the CacheStorage. If so, serve that.</li> - <li>If not, fetch the request from the network, then also open the cache created in the first block and add a clone of the request to it using {{domxref("Cache.put")}} (<code>cache.put(event.request, response.clone())</code>.)</li> - <li>If this fails (e.g. because the network is down), return a fallback response.</li> -</ol> - -<p>Finally, return whatever the custom response ended up being equal to, using {{domxref("FetchEvent.respondWith")}}.</p> - -<pre class="brush: js notranslate">self.addEventListener('install', function(event) { - event.waitUntil( - caches.open('v1').then(function(cache) { - return cache.addAll([ - '/sw-test/', - '/sw-test/index.html', - '/sw-test/style.css', - '/sw-test/app.js', - '/sw-test/image-list.js', - '/sw-test/star-wars-logo.jpg', - '/sw-test/gallery/bountyHunters.jpg', - '/sw-test/gallery/myLittleVader.jpg', - '/sw-test/gallery/snowTroopers.jpg' - ]); - }) - ); -}); - -self.addEventListener('fetch', function(event) { - event.respondWith(caches.match(event.request).then(function(response) { - // caches.match() always resolves - // but in case of success response will have value - if (response !== undefined) { - return response; - } else { - return fetch(event.request).then(function (response) { - // response may be used only once - // we need to save clone to put one copy in cache - // and serve second one - let responseClone = response.clone(); - - caches.open('v1').then(function (cache) { - cache.put(event.request, responseClone); - }); - return response; - }).catch(function () { - return caches.match('/sw-test/gallery/myLittleVader.jpg'); - }); - } - })); -}); -</pre> - -<p>This snippet shows how the API can be used outside of a service worker context, and uses the <code>await</code> operator for much more readable code.</p> - -<pre class="brush: js notranslate">// Try to get data from the cache, but fall back to fetching it live. -async function getData() { - const cacheVersion = 1; - const cacheName = `myapp-${ cacheVersion }`; - const url = 'https://jsonplaceholder.typicode.com/todos/1'; - let cachedData = await getCachedData( cacheName, url ); - - if ( cachedData ) { - console.log( 'Retrieved cached data' ); - return cachedData; - } - - console.log( 'Fetching fresh data' ); - - const cacheStorage = await caches.open( cacheName ); - await cacheStorage.add( url ); - cachedData = await getCachedData( cacheName, url ); - await deleteOldCaches( cacheName ); - - return cachedData; -} - -// Get data from the cache. -async function getCachedData( cacheName, url ) { - const cacheStorage = await caches.open( cacheName ); - const cachedResponse = await cacheStorage.match( url ); - - if ( ! cachedResponse || ! cachedResponse.ok ) { - return false; - } - - return await cachedResponse.json(); -} - -// Delete any old caches to respect user's disk space. -async function deleteOldCaches( currentCache ) { - const keys = await caches.keys(); - - for ( const key of keys ) {<font><font> - const isOurCache = 'myapp-' === key.substr (0, 6);</font></font> -<font><font> - ถ้า (currentCache === คีย์ ||! isOurCache) {</font></font><font><font> - ดำเนินการต่อ;</font></font><font><font> - }</font></font> -<font><font> - caches.delete (คีย์);</font></font><font><font> - }</font></font><font><font> -}</font></font> -<font><font> -ลอง {</font></font><font><font> - const data = รอ getData ();</font></font><font><font> - console.log ({data});</font></font><font><font> -} catch (error) {</font></font><font><font> - console.error ({error});</font></font><font><font> -}</font></font></pre> - -<h2 id="ข้อมูลจำเพาะ"><font><font>ข้อมูลจำเพาะ</font></font></h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col"><font><font>ข้อมูลจำเพาะ</font></font></th> - <th scope="col"><font><font>สถานะ</font></font></th> - <th scope="col"><font><font>แสดงความคิดเห็น</font></font></th> - </tr> - <tr> - <td><font><font>{{SpecName ('Service Workers', '#cachestorage', 'CacheStorage')}}</font></font></td> - <td><font><font>{{Spec2 ('พนักงานบริการ')}}</font></font></td> - <td><font><font>นิยามเริ่มต้น</font></font></td> - </tr> - </tbody> -</table> - -<h2 id="ความเข้ากันได้ของเบราว์เซอร์"><font><font>ความเข้ากันได้ของเบราว์เซอร์</font></font></h2> - -<div class="hidden"><font><font>ตารางความเข้ากันได้ในหน้านี้สร้างขึ้นจากข้อมูลที่มีโครงสร้าง </font><font>หากคุณต้องการมีส่วนร่วมในข้อมูลโปรดดู</font></font><a href="https://github.com/mdn/browser-compat-data"><font><font>https://github.com/mdn/browser-compat-data</font></font></a><font><font>และส่งคำขอดึงข้อมูลมาให้เรา</font></font></div> - -<p><font><font>{{คอมแพต ("api.CacheStorage")}}</font></font></p> - -<h2 id="ดูสิ่งนี้ด้วย"><font><font>ดูสิ่งนี้ด้วย</font></font></h2> - -<ul> - <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorker_API/Using_Service_Workers"><font><font>การใช้พนักงานบริการ</font></font></a></li> - <li><font><font>{{domxref ("แคช")}}</font></font></li> - <li><font><font>{{domxref ("WindowOrWorkerGlobalScope.caches")}}</font></font></li> -</ul> diff --git a/files/th/web/api/geolocation/index.html b/files/th/web/api/geolocation/index.html deleted file mode 100644 index dce3f6b33a..0000000000 --- a/files/th/web/api/geolocation/index.html +++ /dev/null @@ -1,142 +0,0 @@ ---- -title: Geolocation -slug: Web/API/Geolocation -tags: - - API - - Advanced - - Geolocation API - - Interface - - NeedsTranslation - - Reference - - Secure context - - TopicStub -translation_of: Web/API/Geolocation ---- -<div>{{securecontext_header}}{{APIRef("Geolocation API")}}</div> - -<p>The <code><strong>Geolocation</strong></code> interface represents an object able to programmatically obtain the position of the device. It gives Web content access to the location of the device. This allows a Web site or app to offer customized results based on the user's location.</p> - -<p>An object with this interface is obtained using the {{domxref("navigator.geolocation")}} property implemented by the {{domxref("Navigator")}} object.</p> - -<div class="note"> -<p><strong>Note:</strong> For security reasons, when a web page tries to access location information, the user is notified and asked to grant permission. Be aware that each browser has its own policies and methods for requesting this permission.</p> -</div> - -<h2 id="Properties">Properties</h2> - -<p><em>The <code>Geolocation</code> interface neither implements, nor inherits any property.</em></p> - -<h2 id="Methods">Methods</h2> - -<p><em><em>The <code>Geolocation</code> interface doesn't inherit any </em>method</em>.</p> - -<dl> - <dt>{{domxref("Geolocation.getCurrentPosition()")}} {{securecontext_inline}}</dt> - <dd>Determines the device's current location and gives back a {{domxref("Position")}} object with the data.</dd> - <dt>{{domxref("Geolocation.watchPosition()")}} {{securecontext_inline}}</dt> - <dd>Returns a <code>long</code> value representing the newly established callback function to be invoked whenever the device location changes.</dd> - <dt>{{domxref("Geolocation.clearWatch()")}} {{securecontext_inline}}</dt> - <dd>Removes the particular handler previously installed using <code>watchPosition()</code>.</dd> -</dl> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('Geolocation')}}</td> - <td>{{Spec2('Geolocation')}}</td> - <td>Initial specification.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<p>{{ CompatibilityTable() }}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Edge</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>5</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoDesktop("1.9.1")}}</td> - <td>9</td> - <td>10.60<br> - Removed in 15.0<br> - Reintroduced in 16.0</td> - <td>5</td> - </tr> - <tr> - <td>Secure context-only</td> - <td>47</td> - <td>{{CompatUnknown()}}</td> - <td>{{CompatGeckoDesktop("55")}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Edge</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatUnknown()}}</td> - <td>{{CompatUnknown()}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoMobile("4")}}</td> - <td>{{CompatUnknown()}}</td> - <td>10.60</td> - <td>{{CompatUnknown()}}</td> - </tr> - <tr> - <td>Secure context-only</td> - <td>{{CompatNo}}</td> - <td>47</td> - <td>{{CompatUnknown()}}</td> - <td>{{CompatGeckoDesktop("55")}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/WebAPI/Using_geolocation" title="/en-US/docs/WebAPI/Using_geolocation">Using geolocation</a></li> -</ul> diff --git a/files/th/web/api/geolocation_api/index.html b/files/th/web/api/geolocation_api/index.html deleted file mode 100644 index 91ae57a2e6..0000000000 --- a/files/th/web/api/geolocation_api/index.html +++ /dev/null @@ -1,92 +0,0 @@ ---- -title: Geolocation API -slug: Web/API/Geolocation_API -translation_of: Web/API/Geolocation_API ---- -<div>{{securecontext_header}}{{DefaultAPISidebar("Geolocation API")}}</div> - -<p><strong>Geolocation API</strong>จะช่วยให้ผู้ใช้สามารถใช้งานเว็บไซต์ได้หากพวกเขาต้องการที่จะใช้เหตุผลในการรายงานข้อมูลตำแหน่ง</p> - -<p>Web ส่วนขยายที่ต้องการใช้วัตถุ Geolocation ต้องเพิ่ม<code>"geolocation"</code>สิทธิ์ในการแสดงรายการ ระบบปฏิบัติการของผู้ใช้จะแจ้งให้ผู้ใช้อนุญาตการเข้าถึงตำแหน่งในครั้งแรกที่มีการร้องขอ</p> - -<h2 id="แนวคิดและการใช้งาน">แนวคิดและการใช้งาน</h2> - -<p>คุณมักจะต้องการดึงข้อมูลตำแหน่งของผู้ใช้ในแอปพลิเคชันเว็บของคุณเช่นเพื่อพล็อตตำแหน่งของพวกเขาบนแผนที่หรือแสดงข้อมูลส่วนตัวที่เกี่ยวข้องกับตำแหน่งของพวกเขา</p> - -<p>Geolocation API เข้าถึงได้ผ่านการเรียก {{domxref("Navigator.geolocation", "navigator.geolocation")}}; สิ่งนี้จะทำให้เบราว์เซอร์ของผู้ใช้ถามเพื่อขออนุญาตเข้าถึงข้อมูลตำแหน่งของพวกเขา หากพวกเขายอมรับเบราว์เซอร์จะใช้ฟังก์ชันการทำงานที่ดีที่สุดบนอุปกรณ์เพื่อเข้าถึงข้อมูลนี้ (ตัวอย่างเช่น GPS)</p> - -<p>นักพัฒนาซอฟต์แวร์สามารถเข้าถึงข้อมูลตำแหน่งนี้ได้สองวิธี:</p> - -<ul> - <li>{{domxref("Geolocation.getCurrentPosition()")}}: ดึงตำแหน่งปัจจุบันของอุปกรณ์</li> - <li>{{domxref("Geolocation.watchPosition()")}}: ลงทะเบียนฟังก์ชั่นการจัดการที่จะถูกเรียกโดยอัตโนมัติทุกครั้งที่มีการเปลี่ยนตำแหน่งของอุปกรณ์โดยคืนตำแหน่งที่อัปเดต</li> -</ul> - -<p>ในทั้งสองกรณีการเรียกใช้เมธอดใช้เวลาถึงสามอาร์กิวเมนต์:</p> - -<ul> - <li>การเรียกกลับสำเร็จที่ได้รับคำสั่ง: หากการเรียกคืนตำแหน่งสำเร็จการเรียกกลับจะดำเนินการกับวัตถุ {{domxref("GeolocationPosition")}} เป็นพารามิเตอร์เดียวเพื่อให้สามารถเข้าถึงข้อมูลตำแหน่งได้</li> - <li>ข้อผิดพลาดทางเลือกโทรกลับ: หากการเรียกคืนตำแหน่งไม่สำเร็จการเรียกกลับจะดำเนินการกับวัตถุ {{domxref("GeolocationPositionError")}} เป็นพารามิเตอร์เดียวให้ข้อมูลการเข้าถึงสิ่งที่ผิดพลาด</li> - <li>{{domxref("PositionOptions")}} วัตถุที่เป็นตัวเลือกซึ่งมีตัวเลือกสำหรับการดึงข้อมูลตำแหน่ง</li> -</ul> - -<p>สำหรับข้อมูลเพิ่มเติมเกี่ยวกับการใช้ Geolocation อ่าน<a href="/en-US/docs/Web/API/Geolocation_API/Using_the_Geolocation_API">ใช้ Geolocation </a>API</p> - -<h2 id="อินเตอร์เฟซ">อินเตอร์เฟซ</h2> - -<dl> - <dt>{{domxref("Geolocation")}}</dt> - <dd>คลาสหลักของ API นี้ - ประกอบด้วยวิธีการดึงข้อมูลตำแหน่งปัจจุบันของผู้ใช้เฝ้าดูการเปลี่ยนแปลงตำแหน่งและล้างนาฬิกาที่ตั้งไว้ก่อนหน้านี้</dd> - <dt>{{domxref("GeolocationPosition")}}</dt> - <dd>แสดงตำแหน่งของผู้ใช้ <code>GeolocationPosition</code>อินสแตนซ์ถูกส่งกลับโดยการเรียกร้องที่ประสบความสำเร็จให้เป็นหนึ่งในวิธีการที่มีอยู่ภายใน {{domxref("Geolocation")}} ภายในโทรกลับประสบความสำเร็จและมีการประทับเวลาบวก {{domxref("GeolocationCoordinates")}} ตัวอย่างวัตถุ</dd> - <dt>{{domxref("GeolocationCoordinates")}}</dt> - <dd>แสดงเรียงลำดับของตำแหน่งที่มีการเชื่อมโยง<code>GeolocationCoordinates</code>และข้อมูลอื่น ๆ ที่สำคัญ</dd> - <dt>{{domxref("GeolocationPositionError")}}</dt> - <dd>A <code>GeolocationPositionError</code>ถูกส่งคืนโดยการเรียกที่ไม่สำเร็จไปยังหนึ่งในวิธีการที่อยู่ภายใน {{domxref("Geolocation")}}, ภายในการเรียกกลับข้อผิดพลาดและมีรหัสข้อผิดพลาดและข้อความ</dd> - <dt>{{domxref("Navigator.geolocation")}}</dt> - <dd>API เข้าสู่ระบบส่งคืนวัตถุ {{domxref("ตำแหน่งทางภูมิศาสตร์")}}</dd> -</dl> - -<h2 id="พจนานุกรม">พจนานุกรม</h2> - -<dl> - <dt>{{domxref("PositionOptions")}}</dt> - <dd>แสดงให้เห็นถึงเนื้อหาที่มีตัวเลือกที่จะผ่านการเก็บของ {{domxref("Geolocation.getCurrentPosition()")}} และ {{domxref("Geolocation.watchPosition()")}}</dd> -</dl> - -<h2 id="ตัวอย่าง">ตัวอย่าง</h2> - -<div>{{page("/en-US/docs/Web/API/Geolocation_API/Using_the_Geolocation_API","Examples")}}</div> - -<h2 id="ข้อมูลจำเพาะ">ข้อมูลจำเพาะ</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">สเปค</th> - <th scope="col">สถานะ</th> - <th scope="col">คิดเห็น</th> - </tr> - <tr> - <td>{{SpecName("ตำแหน่งทางภูมิศาสตร์")}}}</td> - <td>{{Spec2("ตำแหน่งทางภูมิศาสตร์")}}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="ความเข้ากันได้ของเบราว์เซอร์">ความเข้ากันได้ของเบราว์เซอร์</h2> - -<p>{{compat("api.Geolocation")}}</p> - -<h3 id="ความพร้อมใช้งาน">ความพร้อมใช้งาน</h3> - -<p>เนื่องจาก Google เป็นผู้ให้บริการระบุตำแหน่งผ่าน WiFi ดังนั้นวานิลลา Geolocation API จึงอาจไม่ด้านใช้งานพนักงานพนักงานได้ในห้างหุ้นส่วนจำกัดห้างหุ้นส่วนจำกัดออกออกประเทศจีนที่ที่คุณคุณที่คุณคุณอาจจะใช้ที่คุณคุณคุณผู้ให้บริการบุคคลที่สามในห้างหุ้นส่วนจำกัดห้างหุ้นส่วนจำกัดท้องถิ่นเช่น<a href="http://lbsyun.baidu.com/index.php?title=jspopular/guide/geolocation">Baidu</a> , <a href="https://lbs.amap.com/api/javascript-api/guide/services/geolocation#geolocation">AutoNavi</a>หรือTencent บริการเหล่านี้ที่อยู่ IP ของผู้ใช้และ / หรือระบุตำแหน่งที่ดีขึ้น<a href="http://lbs.qq.com/tool/component-geolocation.html"> </a></p> - -<h2 id="ดูสิ่งนี้ด้วย">ดูสิ่งนี้ด้วย</h2> - -<ul> - <li><a href="/en-US/docs/Web/API/Geolocation_API/Using_the_Geolocation_API">ใช้ Geolocation API</a></li> - <li><a href="https://www.w3.org/TR/geolocation-API/" rel="external">API ตำแหน่งทางภูมิศาสตร์บน w3.org</a></li> - <li><a href="https://hacks.mozilla.org/2013/10/who-moved-my-geolocation/">ใครรู้ตำแหน่งของฉัน</a> (บล็อก Hacks)</li> -</ul> diff --git a/files/th/web/api/geolocation_api/using_the_geolocation_api/index.html b/files/th/web/api/geolocation_api/using_the_geolocation_api/index.html deleted file mode 100644 index 3b2984397b..0000000000 --- a/files/th/web/api/geolocation_api/using_the_geolocation_api/index.html +++ /dev/null @@ -1,170 +0,0 @@ ---- -title: Using the Geolocation API -slug: Web/API/Geolocation_API/Using_the_Geolocation_API -tags: - - Geolocation API - - Guide - - Tutorial -translation_of: Web/API/Geolocation_API/Using_the_Geolocation_API ---- -<div>{{securecontext_header}}{{DefaultAPISidebar("Geolocation API")}}</div> - -<p>Geolocation API ใช้เพื่อเรียกคืนตำแหน่งของผู้ใช้เพื่อให้สามารถใช้เพื่อแสดงตำแหน่งโดยใช้ API การแมป บทความนี้อธิบายพื้นฐานของวิธีใช้</p> - -<h2 id="วัตถุตำแหน่งทางภูมิศาสตร์">วัตถุตำแหน่งทางภูมิศาสตร์</h2> - -<p><a href="/en-US/docs/Web/API/Geolocation">Geolocation API</a>สามารถใช้ได้ผ่านทาง {{domxref("navigator.geolocation")}} วัตถุ</p> - -<p>หากวัตถุมีอยู่บริการระบุตำแหน่งทางภูมิศาสตร์จะพร้อมใช้งาน คุณสามารถทดสอบการมีตำแหน่งทางภูมิศาสตร์ได้ดังนี้:</p> - -<pre class="brush: js notranslate">if('geolocation' in navigator) { - /* geolocation is available */ -} else { - /* geolocation IS NOT available */ -} -</pre> - -<h3 id="รับตำแหน่งปัจจุบัน">รับตำแหน่งปัจจุบัน</h3> - -<p>ในการรับตำแหน่งปัจจุบันของผู้ใช้คุณสามารถเรียกใช้วิธี {{domxref("Geolocation.getCurrentPosition","getCurrentPosition()")}} สิ่งนี้จะเริ่มต้นคำขอแบบอะซิงโครนัสเพื่อตรวจหาตำแหน่งของผู้ใช้และสอบถามฮาร์ดแวร์การจัดตำแหน่งเพื่อรับข้อมูลที่ทันสมัย เมื่อกำหนดตำแหน่งแล้วฟังก์ชันการเรียกกลับที่กำหนดไว้จะถูกดำเนินการ คุณสามารถเลือกที่จะให้ฟังก์ชั่นการติดต่อกลับที่สองที่จะดำเนินการหากเกิดข้อผิดพลาด พารามิเตอร์ตัวที่สามเป็นตัวเลือกคือวัตถุตัวเลือกที่คุณสามารถตั้งค่าอายุสูงสุดของตำแหน่งที่ส่งคืนเวลารอคำขอและถ้าคุณต้องการความแม่นยำสูงสำหรับตำแหน่ง</p> - -<div class="note"> -<p><strong>หมายเหตุ:</strong>โดยค่าเริ่มต้น {{domxref("Geolocation.getCurrentPosition","getCurrentPosition()")}} พยายามตอบเร็วที่สุดเท่าที่จะทำได้ด้วยความแม่นยำต่ำ มันจะมีประโยชน์ถ้าคุณต้องการคำตอบอย่างรวดเร็วโดยไม่คำนึงถึงความถูกต้อง อุปกรณ์ที่มีจีพีเอส, ตัวอย่างเช่นสามารถใช้เวลาเป็นนาทีหรือมากกว่าที่จะได้รับสัญญาณ GPS, ข้อมูลเพื่อความแม่นยำน้อย (ที่ตั้งของทรัพย์สินทางปัญญาหรือ WiFi) <code>getCurrentPosition()</code>อาจจะกลับไป</p> -</div> - -<pre class="brush: js notranslate">navigator.geolocation.getCurrentPosition((position) => { - doSomething(position.coords.latitude, position.coords.longitude); -});</pre> - -<p>ตัวอย่างด้านบนจะทำให้<code>doSomething()</code>ฟังก์ชันทำงานเมื่อได้รับตำแหน่ง</p> - -<h3 id="ดูตำแหน่งปัจจุบัน">ดูตำแหน่งปัจจุบัน</h3> - -<p>หากข้อมูลตำแหน่งเปลี่ยนแปลง (โดยการเคลื่อนไหวของอุปกรณ์หรือข้อมูลทางภูมิศาสตร์ที่แม่นยำกว่ามาถึง) คุณสามารถตั้งค่าฟังก์ชั่นการโทรกลับที่ถูกเรียกพร้อมกับข้อมูลตำแหน่งที่อัปเดตนั้น สิ่งนี้ทำได้โดยใช้ฟังก์ชัน {{domxref("Geolocation.watchPosition","watchPosition()")}} ซึ่งมีพารามิเตอร์อินพุตเหมือนกับ {{domxref("Geolocation.getCurrentPosition","getCurrentPosition()")}}. ฟังก์ชั่นการโทรกลับถูกเรียกหลายครั้งทำให้เบราว์เซอร์สามารถอัปเดตตำแหน่งของคุณในขณะที่คุณย้ายหรือให้ตำแหน่งที่แม่นยำยิ่งขึ้นเนื่องจากใช้เทคนิคต่าง ๆ ในการระบุตำแหน่งของคุณ ฟังก์ชั่นการเรียกกลับข้อผิดพลาดซึ่งเป็นตัวเลือกเช่นเดียวกับมัน<code>getCurrentPosition()</code>สามารถเรียกซ้ำ</p> - -<div class="note"> -<p><strong>Note:</strong> You can use {{domxref("Geolocation.watchPosition","watchPosition()")}} without an initial {{domxref("Geolocation.getCurrentPosition","getCurrentPosition()")}} call.</p> -</div> - -<pre class="brush: js notranslate">const watchID = navigator.geolocation.watchPosition((position) => { - doSomething(position.coords.latitude, position.coords.longitude); -});</pre> - -<p>The {{domxref("Geolocation.watchPosition","watchPosition()")}} method returns an ID number that can be used to uniquely identify the requested position watcher; you use this value in tandem with the {{domxref("Geolocation.clearWatch","clearWatch()")}} method to stop watching the user's location.</p> - -<pre class="brush: js notranslate">navigator.geolocation.clearWatch(watchID); -</pre> - -<h3 id="Fine_tuning_the_response">Fine tuning the response</h3> - -<p>Both {{domxref("Geolocation.getCurrentPosition","getCurrentPosition()")}} and {{domxref("Geolocation.watchPosition","watchPosition()")}} accept a success callback, an optional error callback, and an optional {{domxref("PositionOptions")}} object.</p> - -<p>This object allows you to specify whether to enable high accuracy, a maximum age for the returned position value (up until this age it will be cached and reused if the same position is requested again; after this the browser will request fresh position data), and a timeout value that dictates how long the browser should attempt to get the position data for, before it times out.</p> - -<p>A call to {{domxref("Geolocation.watchPosition","watchPosition")}} could look like:</p> - -<pre class="brush: js notranslate">function success(position) { - doSomething(position.coords.latitude, position.coords.longitude); -} - -function error() { - alert('Sorry, no position available.'); -} - -const options = { - enableHighAccuracy: true, - maximumAge: 30000, - timeout: 27000 -}; - -const watchID = navigator.geolocation.watchPosition(success, error, options);</pre> - -<h2 id="Describing_a_position">Describing a position</h2> - -<p>The user's location is described using a {{domxref("GeolocationPosition")}} object instance, which itself contains a {{domxref("GeolocationCoordinates")}} object instance.</p> - -<p>The <code>GeolocationPosition</code> instance contains only two things, a <code>coords</code> property that contains the <code>GeolocationCoordinates</code> instance, and a <code>timestamp</code> property that contains a {{domxref("DOMTimeStamp")}} instance representing the time at which the position data was retrieved.</p> - -<p>The <code>GeolocationCoordinates</code> instance contains a number of properties, but the two you'll use most commonly are <code>latitude</code> and <code>longitude</code>, which are what you need to draw your position on a map. Hence many Geolocation success callbacks look fairly simple:</p> - -<pre class="brush: js notranslate">function success(position) { - const latitude = position.coords.latitude; - const longitude = position.coords.longitude; - - // Do something with your latitude and longitude -}</pre> - -<p>You can however get a number of other bits of information from a <code>GeolocationCoordinates</code> object, including altitude, speed, what direction the device is facing, and an accuracy measure of the altitude, longitude, and latitude data.</p> - -<h2 id="Handling_errors">Handling errors</h2> - -<p>The error callback function, if provided when calling <code>getCurrentPosition()</code> or <code>watchPosition()</code>, expects a <code><a href="/en-US/docs/Web/API/GeolocationPositionError">GeolocationPositionError</a></code> object instance as its first parameter. This object type contains two properties, a <code>code</code> indicating what type of error has been returned, and a human-readable <code>message</code> that describes what the error code means.</p> - -<p>You could use it like so:</p> - -<pre class="brush: js notranslate">function errorCallback(error) { - alert(`ERROR(${error.code}): ${error.message}`); -}; -</pre> - -<h2 id="Examples">Examples</h2> - -<p>In the following example the Geolocation API is used to retrieve the user's latitude and longitude. If sucessful, the available hyperlink is populated with an <code>openstreetmap.org</code> URL that will show their location.</p> - -<div class="hidden"> -<pre class="brush: css notranslate">body { - padding: 20px; - background-color:#ffffc9 -} - -button { - margin: .5rem 0; -} -</pre> -</div> - -<h3 id="HTML">HTML</h3> - -<pre class="brush: html; notranslate"><button id = "find-me">Show my location</button><br/> -<p id = "status"></p> -<a id = "map-link" target="_blank"></a> -</pre> - -<h3 id="JavaScript">JavaScript</h3> - -<pre class="brush: js notranslate">function geoFindMe() { - - const status = document.querySelector('#status'); - const mapLink = document.querySelector('#map-link'); - - mapLink.href = ''; - mapLink.textContent = ''; - - function success(position) { - const latitude = position.coords.latitude; - const longitude = position.coords.longitude; - - status.textContent = ''; - mapLink.href = `https://www.openstreetmap.org/#map=18/${latitude}/${longitude}`; - mapLink.textContent = `Latitude: ${latitude} °, Longitude: ${longitude} °`; - } - - function error() { - status.textContent = 'Unable to retrieve your location'; - } - - if(!navigator.geolocation) { - status.textContent = 'Geolocation is not supported by your browser'; - } else { - status.textContent = 'Locating…'; - navigator.geolocation.getCurrentPosition(success, error); - } - -} - -document.querySelector('#find-me').addEventListener('click', geoFindMe); -</pre> - -<h3 id="Result">Result</h3> - -<p>{{EmbedLiveSample('Examples', 350, 150)}}</p> diff --git a/files/th/web/api/history_api/index.html b/files/th/web/api/history_api/index.html deleted file mode 100644 index a00cf0ca4b..0000000000 --- a/files/th/web/api/history_api/index.html +++ /dev/null @@ -1,249 +0,0 @@ ---- -title: Manipulating the browser history -slug: Web/API/History_API -translation_of: Web/API/History_API ---- -<p><font><font>DOM {{domxref ("window")}} ให้การเข้าถึงประวัติของเบราเซอร์ผ่าน {{domxref ("window.history", "history")}} วัตถุ </font><font>ช่วยให้คุณสามารถเคลื่อนย้ายไปมาได้ตลอดเวลาผ่านประวัติผู้ใช้เช่นเดียวกับ - โดยเริ่มจาก HTML5 - จัดการกับเนื้อหาของสแต็คประวัติ</font></font></p> - -<h2 id="การเดินทางผ่านประวัติศาสตร์"><font><font>การเดินทางผ่านประวัติศาสตร์</font></font></h2> - -<p><font><font>ย้ายไปข้างหน้าและย้อนกลับผ่านทางประวัติศาสตร์ของผู้ใช้จะกระทำโดยใช้</font></font><code>back()</code><font><font>, </font></font><code>forward()</code><font><font>และ</font></font><code>go()</code><font><font> วิธีการ</font></font></p> - -<h3 id="ก้าวไปข้างหน้าและข้างหลัง"><font><font>ก้าวไปข้างหน้าและข้างหลัง</font></font></h3> - -<p><font><font>หากต้องการย้อนกลับไปในอดีตเพียงแค่ทำ:</font></font></p> - -<pre class="brush: js"><font><font>window.history.back (); -</font></font></pre> - -<p><font><font>วิธีนี้จะทำหน้าที่เหมือนกับผู้ใช้คลิกที่ปุ่มย้อนกลับในแถบเครื่องมือของเบราว์เซอร์</font></font></p> - -<p><font><font>ในทำนองเดียวกันคุณสามารถก้าวไปข้างหน้า (เหมือนกับว่าผู้ใช้คลิกปุ่มไปข้างหน้า) เช่นนี้:</font></font></p> - -<pre class="brush: js"><font><font>window.history.forward (); -</font></font></pre> - -<h3 id="การย้ายไปยังจุดที่เฉพาะเจาะจงในประวัติศาสตร์"><font><font>การย้ายไปยังจุดที่เฉพาะเจาะจงในประวัติศาสตร์</font></font></h3> - -<p><font><font>คุณสามารถใช้</font></font><code>go()</code><font><font> วิธีการโหลดหน้าเว็บเฉพาะจากประวัติเซสชันซึ่งระบุโดยตำแหน่งสัมพัทธ์ไปยังหน้าปัจจุบัน (โดยที่หน้าปัจจุบันเป็นดัชนีสัมพัทธ์ 0)</font></font></p> - -<p><font><font>หากต้องการย้ายกลับหนึ่งหน้า (เทียบเท่ากับการโทร</font></font><code>back()</code><font><font>):</font></font></p> - -<pre class="brush: js"><font><font>window.history.go (-1); -</font></font></pre> - -<p><font><font>เพื่อเลื่อนหน้าเว็บเช่นเดียวกับการโทร</font></font><code>forward()</code><font><font>:</font></font></p> - -<pre class="brush: js"><font><font>window.history.go (1); -</font></font></pre> - -<p><font><font>ในทำนองเดียวกันคุณสามารถย้ายหน้า 2 หน้าโดยการส่งผ่าน 2 เป็นต้น</font></font></p> - -<p><font><font>คุณสามารถกำหนดจำนวนหน้าในสแต็คประวัติโดยการดูที่ค่าของคุณสมบัติ length:</font></font></p> - -<pre class="brush: js"><font><font>var numberOfEntries = window.history.length; -</font></font></pre> - -<div class="note"><strong><font><font>หมายเหตุ:</font></font></strong><font><font> Internet Explorer สนับสนุนการส่ง URL สตริงเป็นพารามิเตอร์ไปยัง</font></font><code>go()</code><font><font>; </font><font>นี้ไม่ได้มาตรฐานและไม่ได้รับการสนับสนุนโดยตุ๊กแก</font></font></div> - -<h2 id="การเพิ่มและแก้ไขรายการประวัติ"><font><font>การเพิ่มและแก้ไขรายการประวัติ</font></font></h2> - -<p><font><font>{{gecko_minversion_header ("2")}}</font></font></p> - -<p><font><font>HTML5 นำเสนอ</font><font>เมธอด</font></font><a href="/en-US/docs/Web/API/History/pushState"><font><font>history.pushState ()</font></font></a><font><font>และ</font></font><a href="/en-US/docs/Web/API/History_API#The_replaceState()_method"><font><font>history.replaceState ()</font></font></a><font><font>ซึ่งช่วยให้คุณสามารถเพิ่มและแก้ไขรายการประวัติตามลำดับได้ </font><font>วิธีการเหล่านี้ทำงานร่วมกับเหตุการณ์ {{domxref ("window.onpopstate")}}</font></font></p> - -<p><font><font>การใช้</font></font><code>history.pushState()</code><font><font> การเปลี่ยนแปลง referrer ที่ใช้ในส่วนหัว HTTP สำหรับ</font></font><a href="/en/DOM/XMLHttpRequest" title="en / XMLHttpRequest"><code>XMLHttpRequest</code></a><font><font>อ็อบเจ็กต์ที่สร้างขึ้นหลังจากเปลี่ยนสถานะ </font><font>ผู้อ้างอิงจะเป็น URL ของเอกสารที่มีหน้าต่างอยู่</font></font><code>this</code><font><font>ในขณะที่สร้าง</font></font><a href="/en/DOM/XMLHttpRequest" title="en / XMLHttpRequest"><code>XMLHttpRequest</code></a><font><font>วัตถุ</font></font></p> - -<h3 id="ตัวอย่างของวิธีการ_pushState_()"><font><font>ตัวอย่างของวิธีการ pushState ()</font></font></h3> - -<p><font><font>สมมติว่า</font></font><span class="nowiki"><font><font>http://mozilla.org/foo.html</font></font></span><font><font>ใช้ JavaScript ต่อไปนี้:</font></font></p> - -<pre class="brush: js"><font><font>var stateObj = {foo: "bar"};</font></font><font><font> -history.pushState (stateObj, "page 2", "bar.html");</font></font> -</pre> - -<p><font><font>ซึ่งจะทำให้แถบ URL แสดง</font></font><span class="nowiki"><font><font>http://mozilla.org/bar.html</font></font></span><font><font>แต่จะไม่ทำให้เบราว์เซอร์โหลด</font></font><code>bar.html</code><font><font>หรือตรวจสอบว่า</font></font><code>bar.html</code><font><font>มีอยู่</font></font></p> - -<p><font><font>สมมติว่าตอนนี้ผู้ใช้ไปที่</font></font><span class="nowiki"><font><font>http://google.com</font></font></span><font><font>แล้วคลิกปุ่มย้อนกลับ </font><font>ณ จุดนี้แถบ URL จะแสดง</font></font><span class="nowiki"><font><font>http://mozilla.org/bar.html</font></font></span><font><font>และ</font></font><s><font><font>หน้าจะได้รับจะไม่ได้รับการ</font></font><code>popstate</code><font><font>จัดกิจกรรมที่มี</font></font><em><font><font>สถานะของวัตถุ</font></font></em><font><font>มีสำเนาของ</font></font><code>stateObj</code></s><font><font> ถ้าคุณอ่าน</font><font>คุณจะได้รับ</font></font><code>history.state</code><font><font> </font><font> เหตุการณ์จะไม่ถูกเรียกใช้เนื่องจากโหลดหน้าเว็บใหม่แล้ว </font><font>หน้าเว็บจะมีลักษณะเหมือน</font><font>กัน</font></font><code>stateObj</code><code>popstate</code><code>bar.html</code></p> - -<p><font><font>ถ้าเราคลิกย้อนกลับอีกครั้ง URL จะเปลี่ยนเป็น</font></font><span class="nowiki"><font><font>http://mozilla.org/foo.html</font></font></span><font><font>และเอกสารจะได้รับ </font></font><code>popstate</code><font><font>เหตุการณ์พร้อมกับอ็อบเจ็กต์สถานะว่าง </font><font>ที่นี่อีกเช่นกันการย้อนกลับไม่ได้เปลี่ยนเนื้อหาของเอกสารจากสิ่งที่พวกเขาอยู่ในขั้นตอนก่อนหน้าแม้ว่าเอกสารอาจอัปเดตเนื้อหาด้วยตนเองเมื่อได้รับ</font></font><code>popstate</code><font><font>กิจกรรม</font></font></p> - -<h3 id="วิธีการ_pushState_()"><font><font>วิธีการ pushState ()</font></font></h3> - -<p><code>pushState()</code><font><font>ใช้พารามิเตอร์สามตัว ได้แก่ อ็อบเจ็กต์สถานะชื่อ (ซึ่งปัจจุบันถูกละเว้น) และ (ไม่บังคับ) URL </font><font>ลองดูแต่ละพารามิเตอร์ทั้งสามแบบนี้โดยละเอียด:</font></font></p> - -<ul> - <li> - <p><strong><font><font>วัตถุรัฐ</font></font></strong><font><font> - วัตถุรัฐเป็นวัตถุ JavaScript </font></font><code>pushState()</code><font><font>ซึ่งมีความเกี่ยวข้องกับประวัติศาสตร์รายการใหม่ที่สร้างขึ้นโดย </font><font>เมื่อใดก็ตามที่ผู้ใช้นำทางไปยังรัฐใหม่เป็น</font></font><code>popstate</code><font><font>เหตุการณ์ถูกยิงและ</font></font><code>state</code><font><font>ทรัพย์สินของเหตุการณ์ประกอบด้วยสำเนาของวัตถุรัฐประวัติศาสตร์ของรายการที่</font></font></p> - - <p><font><font>อ็อบเจ็กต์สถานะสามารถเป็นอะไรก็ได้ที่สามารถต่อเนื่องได้ </font><font>เนื่องจาก Firefox จะบันทึกอ็อบเจ็กต์ของรัฐลงในดิสก์ของผู้ใช้เพื่อให้สามารถเรียกคืนได้หลังจากที่ผู้ใช้เริ่มต้นเบราว์เซอร์ใหม่เราจะกำหนดขีด จำกัด ขนาดของอักขระ 640 กิโลวัตต์ในการแสดงสถานะเป็นอนุกรมของอ็อบเจ็กต์สถานะ </font><font>ถ้าคุณส่งต่ออ็อบเจ็กต์สถานะที่มีการแทนเป็นอนุกรมมีขนาดใหญ่กว่านี้</font></font><code>pushState()</code><font><font>เมธอดจะโยนข้อยกเว้น </font><font>หากคุณต้องการพื้นที่มากขึ้นกว่านี้คุณจะได้รับการสนับสนุนให้ใช้</font><font>และ</font></font><code>sessionStorage</code><font><font> / หรือ</font></font><code>localStorage</code></p> - </li> - <li> - <p><strong><font><font>title</font></font></strong><font><font> - ขณะนี้ Firefox ละเว้นพารามิเตอร์นี้แม้ว่าจะใช้งานได้ในอนาคตก็ตาม </font><font>การผ่านสตริงที่ว่างเปล่าควรมีความปลอดภัยในการเปลี่ยนแปลงวิธีการในอนาคต </font><font>หรือคุณสามารถส่งชื่อสั้น ๆ ให้กับรัฐที่คุณกำลังย้ายได้</font></font></p> - </li> - <li> - <p><strong><font><font>URL</font></font></strong><font><font> - </font><strong><font>URL</font></strong><font>ของรายการประวัติการเข้าใหม่จะถูกกำหนดโดยพารามิเตอร์นี้ </font><font>โปรดทราบว่าเบราเซอร์จะไม่พยายามโหลด URL นี้หลังจากที่โทรเข้า</font></font><code>pushState()</code><font><font>มา แต่อาจพยายามโหลด URL ในภายหลังเช่นหลังจากที่ผู้ใช้รีสตาร์ทเบราเซอร์ </font><font>URL ใหม่ไม่จำเป็นต้องเป็นแบบสัมบูรณ์ </font><font>ถ้าเป็นญาติก็จะแก้ไขได้เมื่อเทียบกับ URL ปัจจุบัน </font><font>URL ใหม่ต้องมีต้นกำเนิดเดียวกันกับ URL ปัจจุบัน </font><font>มิฉะนั้น</font></font><code>pushState()</code><font><font>จะโยนข้อยกเว้น </font><font>พารามิเตอร์นี้เป็นทางเลือก; </font><font>หากไม่ได้ระบุไว้ URL จะถูกกำหนดเป็น URL ปัจจุบันของเอกสาร</font></font></p> - </li> -</ul> - -<div class="note"><strong><font><font>หมายเหตุ:</font></font></strong><font><font>ใน Gecko 2.0 {{geckoRelease ("2.0")}} ผ่าน Gecko 5.0 {{geckoRelease ("5.0")}} วัตถุที่ส่งผ่านจะได้รับการจัดอันดับโดยใช้ JSON </font><font>เริ่มต้นในตุ๊กแก 6.0 {{geckoRelease ( "6.0")}} วัตถุที่ถูกต่อเนื่องโดยใช้</font><font>อัลกอริทึมโคลนโครงสร้าง</font></font><a href="/en/DOM/The_structured_clone_algorithm" title="en / DOM / อัลกอริทึมโคลนที่มีโครงสร้าง"><font><font> </font></font></a><font><font>นี้จะช่วยให้ความหลากหลายของวัตถุที่จะผ่านได้อย่างปลอดภัย</font></font></div> - -<p><font><font>ในแง่การโทร</font></font><code>pushState()</code><font><font>จะคล้ายกับการตั้งค่า</font></font><code>window.location = "#foo"</code><font><font>ทั้งสองจะสร้างและเปิดใช้งานรายการบันทึกประวัติอื่นที่เชื่อมโยงกับเอกสารปัจจุบัน </font><font>แต่</font></font><code>pushState()</code><font><font>มีประโยชน์น้อย:</font></font></p> - -<ul> - <li><font><font>URL ใหม่อาจเป็น URL ที่มีต้นกำเนิดเดียวกันกับ URL ปัจจุบัน </font><font>ในทางตรงกันข้ามการตั้งค่า</font></font><code>window.location</code><font><font>ช่วยให้คุณสามารถใช้ {{domxref ("document") }} เดียวกันได้เฉพาะเมื่อคุณแก้ไขเฉพาะแฮช</font></font></li> - <li><font><font>คุณไม่จำเป็นต้องเปลี่ยน URL หากไม่ต้องการ </font><font>ในทางตรงกันข้ามการตั้งค่า</font><font>จะสร้างประวัติศาสตร์เข้าใหม่เท่านั้นถ้ากัญชาปัจจุบันไม่ได้</font></font><code>window.location = "#foo";</code><code>#foo</code></li> - <li><font><font>คุณสามารถเชื่อมโยงข้อมูลโดยพลการกับรายการประวัติการเข้าชมใหม่ของคุณได้ </font><font>ด้วยวิธีแฮชที่ใช้คุณจำเป็นต้องเข้ารหัสข้อมูลที่เกี่ยวข้องทั้งหมดลงในสตริงที่สั้น</font></font></li> - <li><font><font>หาก</font></font><code>title </code><font><font>เบราว์เซอร์ใช้ภายหลังเบราเซอร์ข้อมูลนี้สามารถใช้งานได้ (ไม่ขึ้นอยู่กับการกล่าวคือแฮช)</font></font></li> -</ul> - -<p><font><font>โปรดทราบว่าไม่ได้</font></font><code>pushState()</code><font><font>ทำให้เกิด</font></font><code>hashchange</code><font><font>เหตุการณ์ที่จะถูกเรียกใช้แม้ว่า URL ใหม่จะแตกต่างจาก URL เดิมในแฮชก็ตาม</font></font></p> - -<p><font><font>ใน</font><font>เอกสาร</font></font><a href="/en-US/docs/Mozilla/Tech/XUL"><font><font>XUL</font></font></a><font><font>จะสร้างองค์ประกอบ XUL ที่ระบุไว้</font></font></p> - -<p><font><font>ในเอกสารอื่น ๆ จะสร้างองค์ประกอบด้วย</font></font><code>null</code><font><font>URI namespace</font></font></p> - -<h3 id="วิธี_replaceState_()"><font><font>วิธี replaceState ()</font></font></h3> - -<p><code>history.replaceState()</code><font><font>ดำเนินการเหมือนกับที่</font></font><code>history.pushState()</code><font><font>ยกเว้นการ</font></font><code>replaceState()</code><font><font>แก้ไขรายการประวัติปัจจุบันแทนการสร้างใหม่ </font><font>โปรดทราบว่าสิ่งนี้ไม่ได้ป้องกันไม่ให้มีการสร้างรายการใหม่ในประวัติเบราเซอร์ทั่วโลก</font></font></p> - -<p><code>replaceState()</code><font><font> มีประโยชน์อย่างยิ่งเมื่อคุณต้องการอัปเดตอ็อบเจ็กต์สถานะหรือ URL ของรายการประวัติปัจจุบันเพื่อตอบสนองการดำเนินการบางอย่างของผู้ใช้</font></font></p> - -<div class="note"><strong><font><font>หมายเหตุ:</font></font></strong><font><font>ใน Gecko 2.0 {{geckoRelease ("2.0")}} ผ่าน Gecko 5.0 {{geckoRelease ("5.0")}} วัตถุที่ส่งผ่านจะได้รับการจัดอันดับโดยใช้ JSON </font><font>เริ่มต้นในตุ๊กแก 6.0 {{geckoRelease ( "6.0")}} วัตถุที่ถูกต่อเนื่องโดยใช้</font><font>อัลกอริทึมโคลนโครงสร้าง</font></font><a href="/en/DOM/The_structured_clone_algorithm" title="en / DOM / อัลกอริทึมโคลนที่มีโครงสร้าง"><font><font> </font></font></a><font><font>นี้จะช่วยให้ความหลากหลายของวัตถุที่จะผ่านได้อย่างปลอดภัย</font></font></div> - -<h3 id="ตัวอย่างวิธี_replaceState_()"><font><font>ตัวอย่างวิธี replaceState ()</font></font></h3> - -<p><font><font>สมมติว่า</font></font><span class="nowiki"><font><font>http://mozilla.org/foo.html</font></font></span><font><font>ใช้ JavaScript ต่อไปนี้:</font></font></p> - -<pre class="brush: js"><font><font>var stateObj = {foo: "bar"};</font></font><font><font> -history.pushState (stateObj, "page 2", "bar.html");</font></font> -</pre> - -<p><font><font>คำอธิบายของสองบรรทัดข้างต้นสามารถดูได้ที่ "ตัวอย่างของวิธีการ pushState ()" </font><font>จากนั้นสมมติว่า</font></font><span class="nowiki"><font><font>http://mozilla.org/bar.html</font></font></span><font><font>เรียกใช้ JavaScript ต่อไปนี้:</font></font></p> - -<pre class="brush: js"><font><font>history.replaceState (stateObj, "page 3", "bar2.html"); -</font></font></pre> - -<p><font><font>ซึ่งจะทำให้แถบ URL แสดง</font></font><span class="nowiki"><font><font>http://mozilla.org/bar2.html</font></font></span><font><font>แต่จะไม่ทำให้เบราว์เซอร์โหลด</font></font><code>bar2.html</code><font><font>หรือแม้แต่การตรวจสอบว่า</font></font><code>bar2.html</code><font><font>มีอยู่</font></font></p> - -<p><font><font>สมมติว่าตอนนี้ผู้ใช้ไปที่</font></font><span class="nowiki"><font><font>http://www.microsoft.com</font></font></span><font><font>แล้วคลิกปุ่มย้อนกลับ </font><font>ณ จุดนี้แถบ URL จะแสดง</font></font><span class="nowiki"><font><font>http://mozilla.org/bar2.html </font><font>หากผู้ใช้คลิกกลับมาอีกครั้งแถบ URL จะแสดง http://mozilla.org/foo.html และข้ามผ่าน bar.html ทั้งหมด</font></font></span></p> - -<h3 id="เหตุการณ์_popstate"><font><font>เหตุการณ์ popstate</font></font></h3> - -<p><code>popstate</code><font><font>เหตุการณ์ที่ถูกส่งไปที่หน้าต่างทุกครั้งที่มีการเปลี่ยนแปลงรายการประวัติใช้งาน </font><font>ถ้ารายการประวัติศาสตร์ที่มีการเปิดใช้งานถูกสร้างขึ้นโดยการเรียก</font></font><code>pushState</code><font><font>หรือรับผลกระทบจากการโทรไป</font></font><code>replaceState</code><font><font>ที่</font></font><code>popstate</code><font><font>เหตุการณ์</font></font><code>state</code><font><font>สถานที่ให้บริการประกอบด้วยสำเนาของวัตถุรัฐประวัติศาสตร์ของรายการที่</font></font></p> - -<p><font><font>ดู {{domxref ("window.onpopstate")}} สำหรับการใช้ตัวอย่าง</font></font></p> - -<h3 id="อ่านสถานะปัจจุบัน"><font><font>อ่านสถานะปัจจุบัน</font></font></h3> - -<p><font><font>เมื่อโหลดหน้าเว็บของคุณอาจมีอ็อบเจ็กต์สถานะที่ไม่ใช่ค่าว่าง </font><font>กรณีเช่นนี้อาจเกิดขึ้นได้เช่นถ้าเพจกำหนดอ็อบเจ็กต์สถานะ (ใช้</font></font><code>pushState()</code><font><font>หรือ</font></font><code>replaceState()</code><font><font>) จากนั้นผู้ใช้จะเริ่มต้นเบราว์เซอร์ใหม่ </font><font>เมื่อหน้าเว็บโหลด</font><span style="font-family: helvetica;"><span style="font-family: courier new;"><font>ซ้ำ</font></span></span><font>หน้าเว็บจะได้รับ</font><span style="font-family: helvetica;"><font>เหตุการณ์</font></span></font><span style="font-family: courier new;"><font><font>onload </font></font></span><span style="font-family: helvetica;"><font><font>แต่ไม่มี</font><font>เหตุการณ์ที่ปรากฏ </font></font></span><font><font> แต่ถ้าคุณอ่าน</font></font><span style="font-family: courier new;"><font><font>history.state</font></font></span><font><font>คุณสมบัติที่คุณจะได้รับกลับมาวัตถุรัฐที่คุณจะได้รับถ้า</font></font><span style="font-family: courier new;"><font><font>popstate</font></font></span><font><font>ยิง</font></font></p> - -<p><font><font>คุณสามารถอ่านสถานะของรายการประวัติปัจจุบันได้โดยไม่ต้องรอ</font></font><code>popstate</code><font><font>เหตุการณ์โดยใช้</font></font><code>history.state</code><font><font>คุณสมบัติเช่นนี้:</font></font></p> - -<pre class="brush: js"><font><font>var currentState = history.state; -</font></font></pre> - -<h2 id="ตัวอย่าง"><font><font>ตัวอย่าง</font></font></h2> - -<p><font><font>สำหรับตัวอย่างที่สมบูรณ์ของเว็บไซต์ AJAX, โปรดดูที่: </font><font>ตัวอย่างการนำทางอาแจ็กซ์</font></font></p> - -<h2 id="ข้อมูลจำเพาะ"><font><font>ข้อมูลจำเพาะ</font></font></h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col"><font><font>สเปค</font></font></th> - <th scope="col"><font><font>สถานะ</font></font></th> - <th scope="col"><font><font>คิดเห็น</font></font></th> - </tr> - <tr> - <td><font><font>{{SpecName ('HTML WHATWG', "browsers.html # history", "History")}}</font></font></td> - <td><font><font>{{Spec2 ('HTML WHATWG')}}</font></font></td> - <td><font><font>ไม่มีการเปลี่ยนแปลงจาก {{SpecName ("HTML5 W3C")}}</font></font></td> - </tr> - <tr> - <td><font><font>{{SpecName ('HTML5 W3C', "browsers.html # history", "History")}}</font></font></td> - <td><font><font>{{Spec2 ('HTML5 W3C')}}</font></font></td> - <td><font><font>ความหมายเบื้องต้น</font></font></td> - </tr> - </tbody> -</table> - -<h2 id="ความเข้ากันได้ของเบราเซอร์"><font><font>ความเข้ากันได้ของเบราเซอร์</font></font></h2> - -<p><font><font>{{CompatibilityTable ()}}</font></font></p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th><font><font>ลักษณะ</font></font></th> - <th><font><font>โครเมียม</font></font></th> - <th><font><font>ขอบ</font></font></th> - <th><font><font>Firefox (ตุ๊กแก)</font></font></th> - <th><font><font>Internet Explorer</font></font></th> - <th><font><font>อุปรากร</font></font></th> - <th><font><font>การแข่งรถวิบาก</font></font></th> - </tr> - <tr> - <td><font><font>replaceState, pushState</font></font></td> - <td><font><font>5</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatGeckoDesktop ("2.0")}}</font></font></td> - <td><font><font>10</font></font></td> - <td><font><font>11.50</font></font></td> - <td><font><font>5.0</font></font></td> - </tr> - <tr> - <td><font><font>history.state</font></font></td> - <td><font><font>18</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatGeckoDesktop ("2.0")}}</font></font></td> - <td><font><font>10</font></font></td> - <td><font><font>11.50</font></font></td> - <td><font><font>6.0</font></font></td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th><font><font>ลักษณะ</font></font></th> - <th><font><font>Android</font></font></th> - <th><font><font>ขอบ</font></font></th> - <th><font><font>Firefox Mobile (ตุ๊กแก)</font></font></th> - <th><font><font>IE Mobile</font></font></th> - <th><font><font>Opera Mobile</font></font></th> - <th><font><font>Safari มือถือ</font></font></th> - </tr> - <tr> - <td><font><font>replaceState, pushState</font></font></td> - <td><font><font>{{CompatUnknown ()}}</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatUnknown ()}}</font></font></td> - <td><font><font>{{CompatUnknown ()}}</font></font></td> - <td><font><font>{{CompatUnknown ()}}</font></font></td> - <td><font><font>{{CompatUnknown ()}}</font></font></td> - </tr> - <tr> - <td><font><font>history.state</font></font></td> - <td><font><font>{{CompatUnknown ()}}</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatUnknown ()}}</font></font></td> - <td><font><font>{{CompatUnknown ()}}</font></font></td> - <td><font><font>{{CompatUnknown ()}}</font></font></td> - <td><font><font>{{CompatUnknown ()}}</font></font></td> - </tr> - </tbody> -</table> -</div> - -<p><strong style="font-size: 2.143rem; font-weight: 700; letter-spacing: -1px; line-height: 1;"><font><font>ดูสิ่งนี้ด้วย</font></font></strong></p> - -<ul> - <li><font><font>{{domxref ("window.history")}}</font></font></li> - <li><font><font>{{domxref ("window.onpopstate")}}</font></font></li> -</ul> diff --git a/files/th/web/api/index.html b/files/th/web/api/index.html deleted file mode 100644 index 5ddadeb7cf..0000000000 --- a/files/th/web/api/index.html +++ /dev/null @@ -1,14 +0,0 @@ ---- -title: Web APIs -slug: Web/API -tags: - - API - - JavaScript - - NeedsTranslation - - Reference - - Web -translation_of: Web/API ---- -<p>When writing code for the Web using JavaScript, there are a great many APIs available. Below is a list of all the interfaces (that is, types of objects) that you may be able to use while developing your Web app or site.</p> - -<div>{{APIListAlpha}}</div> diff --git a/files/th/web/api/indexeddb_api/index.html b/files/th/web/api/indexeddb_api/index.html deleted file mode 100644 index 15c6eaf802..0000000000 --- a/files/th/web/api/indexeddb_api/index.html +++ /dev/null @@ -1,308 +0,0 @@ ---- -title: IndexedDB API -slug: Web/API/IndexedDB_API -translation_of: Web/API/IndexedDB_API ---- -<div><font><font>{{DefaultAPISidebar ( "IndexedDB")}}</font></font></div> - -<p><font><font>IndexedDB เป็น API ระดับต่ำสำหรับการจัดเก็บข้อมูลจำนวนมากของโครงสร้างข้อมูลรวมถึงไฟล์ / blobs </font><font>API นี้ใช้ดัชนีเพื่อให้สามารถค้นหาข้อมูลนี้ได้อย่างมีประสิทธิภาพสูง </font><em><u><strong><font>แม้ว่าที่</font></strong></u></em></font><a href="/en-US/docs/Web/API/Web_Storage_API"><font><font>เก็บข้อมูลเว็บ</font></font></a><font><font>จะเป็นประโยชน์สำหรับการจัดเก็บข้อมูลจำนวนน้อย แต่จะไม่ค่อยมีประโยชน์ในการจัดเก็บข้อมูลที่มีโครงสร้างจำนวนมาก </font><font>IndexedDB มีวิธีแก้ปัญหา </font><font>นี่คือหน้า Landing Page หลักสำหรับความครอบคลุม IndexedDB ของ MDN - ที่นี่เรามีลิงก์ไปยังคู่มืออ้างอิงและคู่มือการใช้งาน API แบบเต็มรูปแบบรายละเอียดการสนับสนุนเบราเซอร์และคำอธิบายเกี่ยวกับแนวคิดหลัก ๆ</font></font></p> - -<p><font><font>{{AvailableInWorkers}}</font></font></p> - -<div class="note"> -<p><strong><font><font>หมายเหตุ</font></font></strong><font><font> : IndexedDB API มีประสิทธิภาพ แต่อาจดูเหมือนซับซ้อนเกินไปสำหรับกรณีง่ายๆ </font><font>ถ้าคุณต้องการ API แบบธรรมดาลองใช้ไลบรารีเช่น </font></font><a href="https://localforage.github.io/localForage/"><font><font>localForage</font></font></a><font><font> , </font></font><a href="http://www.dexie.org/"><font><font>dexie.js</font></font></a><font><font> , </font></font><a href="https://github.com/erikolson186/zangodb"><font><font>ZangoDB </font></font></a><font><font><font>และ</font></font></font><font><a href="http://jsstore.net/"><font>JsStore</font></a><font>ที่ทำให้ IndexedDB เป็นโปรแกรมเมอร์ที่เป็นมิตรมากขึ้น</font></font><a href="https://github.com/erikolson186/zangodb"><font> </font></a></p> -</div> - -<h2 id="แนวคิดหลักและการใช้งาน"><font><font>แนวคิดหลักและการใช้งาน</font></font></h2> - -<p><font><font>IndexedDB เป็นระบบฐานข้อมูลการทำธุรกรรมเช่น RDBMS แบบ SQL </font><font>แต่แตกต่างจาก RDBMSes ที่ใช้ SQL ซึ่งใช้ตารางคอลัมน์ถาวร IndexedDB เป็นฐานข้อมูลเชิงวัตถุที่ใช้ JavaScript </font><font>IndexedDB ช่วยให้คุณสามารถจัดเก็บและดึงวัตถุที่มีการสร้างดัชนีด้วย</font></font><strong><font><font>ที่สำคัญ</font></font></strong><font><font> ; </font><font>วัตถุใด ๆ ที่สนับสนุนโดย</font></font><a href="/en-US/docs/Web/Guide/API/DOM/The_structured_clone_algorithm"><font><font>อัลกอริทึมโคลนที่มีโครงสร้าง</font></font></a><font><font>สามารถจัดเก็บได้ </font><font>คุณต้องระบุคีมาฐานข้อมูลเปิดการเชื่อมต่อกับฐานข้อมูลของคุณและจากนั้นดึงข้อมูลและปรับปรุงข้อมูลภายในชุดของ</font><font>การทำธุรกรรม</font></font></p> - -<ul> - <li><font><font>อ่านเพิ่มเติมเกี่ยวกับ</font></font><a href="/en-US/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB"><font><font>แนวคิดที่อยู่เบื้องหลัง </font></font></a><font><font>IndexedDB</font></font></li> - <li><font><font>เรียนรู้การใช้ IndexedDB แบบอะซิงโครนัสจากหลักการแรกด้วย</font><font>คู่มือ</font></font><a href="/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB"><font><font>การใช้ IndexedDB</font></font></a><font><font>ของเรา</font></font></li> - <li><font><font>ดูคำแนะนำสำหรับนักพัฒนาซอฟต์แวร์ที่ทำให้แอปพลิเคชันเว็บทำงานแบบออฟไลน์ได้ที่</font><font>หน้า</font><font>แอปแบบ</font></font><a href="/en-US/Apps/Build/Offline"><font><font>ออฟไลน์</font></font></a></li> -</ul> - -<div class="note"> -<p><strong><font><font>หมายเหตุ</font></font></strong><font><font> : เช่นเดียวกับโซลูชันการจัดเก็บข้อมูลเว็บส่วนใหญ่ IndexedDB จะ</font></font><a class="external" href="http://www.w3.org/Security/wiki/Same_Origin_Policy"><font><font>ใช้นโยบายแหล่งกำเนิด</font></font></a><font><font>เดียวกัน </font><font>ดังนั้นในขณะที่คุณสามารถเข้าถึงข้อมูลที่เก็บไว้ภายในโดเมนคุณจะไม่สามารถเข้าถึงข้อมูลในโดเมนต่างๆได้</font></font></p> -</div> - -<h3 id="Synchronous_และ_Asynchronous"><font><font>Synchronous และ Asynchronous</font></font></h3> - -<p><font><font>การดำเนินงานที่ดำเนินการโดยใช้ IndexedDB ทำแบบอะซิงโครนัสเพื่อไม่ให้บล็อกแอพพลิเคชัน </font><font>IndexedDB เดิมรวม</font><font> APIs </font></font><span style="background-color: #f5f6f5;"><font><font>แบบซิงโครนัส</font></font></span><font><font>และ </font><span style="background-color: #f5f6f5;"><font>แบบอะซิงโครนัส </font></span><font>API ซิงโครนัสมีไว้สำหรับใช้กับ</font></font><a href="/en-US/docs/Web/Guide/Performance/Using_web_workers"><font><font>Web Workers</font></font></a><font><font>เท่านั้น แต่ถูกนำออกจาก spec เนื่องจากไม่ชัดเจนว่าจำเป็นหรือไม่ </font><font>อย่างไรก็ตาม </font></font><span style="background-color: #f5f6f5;"><font><font> API แบบซิงโครนัส</font></font></span><font><font> อาจได้รับคำแนะนำใหม่หากมีความต้องการเพียงพอจากนักพัฒนาเว็บ</font></font></p> - -<h3 id="ข้อ_จำกัด_ในการจัดเก็บและเกณฑ์การขับไล่"><font><font>ข้อ จำกัด ในการจัดเก็บและเกณฑ์การขับไล่</font></font></h3> - -<p><font><font>มีเทคโนโลยีเว็บจำนวนหนึ่งที่เก็บข้อมูลประเภทเดียวกันหรือแบบอื่นทางฝั่งไคลเอ็นต์ (เช่นบนดิสก์ภายในเครื่อง) </font><font>IndexedDB เป็นเรื่องที่พูดถึงกันมากที่สุด </font><font>กระบวนการที่เบราว์เซอร์ทำงานได้ว่าจะจัดสรรพื้นที่ในการจัดเก็บข้อมูลเว็บมากน้อยเพียงใดและจะลบอะไรเมื่อถึงขีด จำกัด นั้นไม่ง่ายและแตกต่างกันระหว่างเบราว์เซอร์ </font></font><a href="/en-US/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria"><font><font>ขีด จำกัด ของพื้นที่เก็บข้อมูลเบราเซอร์และเกณฑ์การขับไล่</font></font></a><font><font>พยายามอธิบายวิธีการทำงานนี้อย่างน้อยที่สุดในกรณีของ Firefox</font></font></p> - -<h2 id="อินเตอร์เฟซ"><font><font>อินเตอร์เฟซ</font></font></h2> - -<p><font><font>เมื่อต้องการเข้าถึงฐานข้อมูลให้เรียก</font></font><a href="/en-US/docs/Web/API/IDBFactory.open"><code>open()</code></a><font><font>ใช้</font></font><a href="/en-US/docs/Web/API/IDBEnvironment.indexedDB"><code>indexedDB</code></a><font><font>แอ็ตทริบิวต์ของ</font><font>ออบเจ็กต์</font></font><a href="/en-US/docs/DOM/window"><font><font>หน้าต่าง </font></font></a><font><font>เมธอดนี้ส่งกลับค่า {{domxref ("IDBRequest")}} object; </font><font>การดำเนินการแบบอะซิงโครนัสจะสื่อสารกับแอพพลิเคชันการเรียกโดยการยิงเหตุการณ์บน {{domxref ("IDBRequest")}} วัตถุ</font></font></p> - -<h3 id="กำลังเชื่อมต่อกับฐานข้อมูล"><font><font>กำลังเชื่อมต่อกับฐานข้อมูล</font></font></h3> - -<dl> - <dt><font><font>{{domxref ( "IDBEnvironment")}}</font></font></dt> - <dd><font><font>ให้การเข้าถึงฟังก์ชันการทำงาน IndexedDB </font><font>มีการใช้งานโดย {{domxref ("window")}} และวัตถุ {{domxref ("worker")}} </font><font>อินเทอร์เฟซนี้ไม่ใช่ส่วนหนึ่งของข้อกำหนด 2.0</font></font></dd> - <dt><font><font>{{domxref ( "IDBFactory")}}</font></font></dt> - <dd><font><font>ให้การเข้าถึงฐานข้อมูล </font><font>นี่คืออินเทอร์เฟซที่ใช้งานโดยอ็อบเจ็กต์ทั่วโลก</font></font><a href="/en-US/docs/Web/API/IDBEnvironment.indexedDB"><code>indexedDB</code></a><font><font>และเป็นจุดเริ่มต้นของ API</font></font></dd> - <dt><font><font>{{domxref ( "IDBOpenDBRequest")}}</font></font></dt> - <dd><font><font>หมายถึงคำขอให้เปิดฐานข้อมูล</font></font></dd> - <dt><font><font>{{domxref ( "IDBDatabase")}}</font></font></dt> - <dd><font><font>หมายถึงการเชื่อมต่อกับฐานข้อมูล </font><font>เป็นวิธีเดียวที่จะได้รับธุรกรรมในฐานข้อมูล</font></font></dd> - <dt><font><font>กำลังเรียกและแก้ไขข้อมูล</font></font></dt> -</dl> - -<dl> - <dt><font><font>{{domxref ( "IDBTransaction")}}</font></font></dt> - <dd><font><font>หมายถึงธุรกรรม </font><font>คุณสร้างธุรกรรมในฐานข้อมูลระบุขอบเขต (เช่นที่เก็บออบเจ็กต์ที่คุณต้องการเข้าถึง) และกำหนดชนิดของการเข้าถึง (อ่านอย่างเดียวหรือเขียน readwrite) ที่คุณต้องการ</font></font></dd> - <dt><font><font>{{domxref ( "IDBRequest")}}</font></font></dt> - <dd><font><font>อินเทอร์เฟซทั่วไปที่จัดการคำขอฐานข้อมูลและให้การเข้าถึงผลการค้นหา</font></font></dd> - <dt><font><font>{{domxref ( "IDBObjectStore")}}</font></font></dt> - <dd><font><font>หมายถึงเก็บออบเจ็กต์ที่อนุญาตให้เข้าถึงชุดข้อมูลในฐานข้อมูล IndexedDB โดยค้นหาคีย์หลัก</font></font></dd> - <dt><font><font>{{domxref ( "IDBIndex")}}</font></font></dt> - <dd><font><font>นอกจากนี้ยังช่วยให้สามารถเข้าถึงชุดย่อยของข้อมูลในฐานข้อมูล IndexedDB ได้ แต่ใช้ดัชนีเพื่อดึงข้อมูลระเบียนแทนที่จะเป็นคีย์หลัก </font><font>บางครั้งก็เร็วกว่าการใช้ {{domxref ("IDBObjectStore")}}</font></font></dd> - <dt><font><font>{{domxref ( "IDBCursor")}}</font></font></dt> - <dd><font><font>Iterates มากกว่าเก็บวัตถุและดัชนี</font></font></dd> - <dt><font><font>{{domxref ( "IDBCursorWithValue")}}</font></font></dt> - <dd><font><font>Iterates มากกว่าเก็บวัตถุและดัชนีและส่งกลับค่าปัจจุบันของเคอร์เซอร์</font></font></dd> - <dt><font><font>{{domxref ( "IDBKeyRange")}}</font></font></dt> - <dd><font><font>กำหนดช่วงสำคัญที่สามารถใช้เพื่อดึงข้อมูลจากฐานข้อมูลในช่วงที่กำหนด</font></font></dd> - <dt><font><font>{{domxref ("IDBLocaleAwareKeyRange")}} {{Non-standard_inline}}</font></font></dt> - <dd><font><font>กำหนดช่วงที่สำคัญที่สามารถนำมาใช้เพื่อดึงข้อมูลจากฐานข้อมูลในช่วงที่กำหนดซึ่งจัดเรียงตามกฎของโลแคลที่ระบุสำหรับดัชนีที่ระบุ (โปรดดูที่</font></font><a href="/en-US/docs/Web/API/IDBObjectStore/createIndex#Parameters"><code>createIndex()</code><font><font>พารามิเตอร์ที่ไม่บังคับ</font></font></a><font><font> ) </font><font>อินเทอร์เฟซนี้ไม่ใช่ส่วนหนึ่งของข้อกำหนด 2.0</font></font></dd> -</dl> - -<h3 id="อินเทอร์เฟซเหตุการณ์ที่กำหนดเอง"><font><font>อินเทอร์เฟซเหตุการณ์ที่กำหนดเอง</font></font></h3> - -<p><font><font>ข้อกำหนดนี้จะเริ่มต้นกิจกรรมด้วยอินเทอร์เฟซที่กำหนดเองต่อไปนี้:</font></font></p> - -<dl> - <dt><font><font>{{domxref ( "IDBVersionChangeEvent")}}</font></font></dt> - <dd><code>IDBVersionChangeEvent</code><font><font>อินเตอร์เฟซแสดงให้เห็นว่ารุ่นของฐานข้อมูลที่มีการเปลี่ยนแปลงเป็นผลมาจากการ {{domxref ( "IDBOpenDBRequest.onupgradeneeded")}} ฟังก์ชั่นจัดการเหตุการณ์</font></font></dd> -</dl> - -<h3 id="อินเตอร์เฟซล้าสมัย"><font><font>อินเตอร์เฟซล้าสมัย</font></font></h3> - -<p><font><font>เวอร์ชันก่อนหน้าของข้อกำหนดยังกำหนดการเชื่อมต่อที่ลบออกไปแล้วในขณะนี้ </font><font>เอกสารเหล่านี้จะได้รับการจัดทำเป็นเอกสารไว้ในกรณีที่คุณจำเป็นต้องอัพเดตโค้ดที่เขียนไว้ก่อนหน้านี้:</font></font></p> - -<dl> - <dt><font><font>{{domxref ("IDBVersionChangeRequest")}} {{obsolete_inline}}</font></font></dt> - <dd><font><font>หมายถึงคำขอให้เปลี่ยนเวอร์ชันของฐานข้อมูล </font><font>วิธีเปลี่ยนเวอร์ชันของฐานข้อมูลได้เปลี่ยนไปแล้ว (โดยเรียก {{domxref ("IDBFactory.open")}} โดยไม่ต้องเรียก {{domxref ("IDBDatabase.setVersion")}}) และอินเทอร์เฟซ {{domxref ("IDBOpenDBRequest")}} มีฟังก์ชันการทำงานของ {{domxref ("IDBVersionChangeRequest")}} ที่ถูกลบ</font></font></dd> - <dt><font><font>{{domxref ("IDBDatabaseException")}} {{obsolete_inline}}</font></font></dt> - <dd><font><font>หมายถึงสภาวะข้อยกเว้นที่สามารถพบได้ในขณะดำเนินการฐานข้อมูล</font></font></dd> - <dt><font><font>{{domxref ("IDBTransactionSync")}} {{obsolete_inline}}</font></font></dt> - <dd><font><font>ซิงค์เวอร์ชันของ {{domxref ("IDBTransaction")}}</font></font></dd> - <dt><font><font>{{domxref ("IDBObjectStoreSync")}} {{obsolete_inline}}</font></font></dt> - <dd><font><font>ซิงค์เวอร์ชันของ {{domxref ("IDBObjectStore")}}</font></font></dd> - <dt><font><font>{{domxref ("IDBIndexSync")}} {{obsolete_inline}}</font></font></dt> - <dd><font><font>ซิงค์เวอร์ชันของ {{domxref ("IDBIndex")}}</font></font></dd> - <dt><font><font>{{domxref ("IDBFactorySync")}} {{obsolete_inline}}</font></font></dt> - <dd><font><font>ซิงค์เวอร์ชันของ {{domxref ("IDBFactory")}}</font></font></dd> - <dt><font><font>{{domxref ("IDBEnvironmentSync")}} {{obsolete_inline}}</font></font></dt> - <dd><font><font>ซิงค์เวอร์ชันของ {{domxref ("IDBEnvironment")}}</font></font></dd> - <dt><font><font>{{domxref ("IDBDatabaseSync")}} {{obsolete_inline}}</font></font></dt> - <dd><font><font>ซิงค์เวอร์ชัน {{domxref ("IDBDatabase")}}</font></font></dd> - <dt><font><font>{{domxref ("IDBCursorSync")}} {{obsolete_inline}}</font></font></dt> - <dd><font><font>ซิงค์เวอร์ชันของ {{domxref ("IDBCursor")}}</font></font></dd> -</dl> - -<h2 id="ตัวอย่าง"><font><font>ตัวอย่าง</font></font></h2> - -<ul> - <li><a class="external" href="http://marco-c.github.io/eLibri/"><font><font>eLibri:</font></font></a><font><font>ห้องสมุดที่มีประสิทธิภาพและโปรแกรมอ่าน eBook ซึ่งเขียนโดย Marco Castelluccio ผู้ชนะ IndexedDB Mozilla DevDerby</font></font></li> - <li><a class="external" href="https://github.com/chrisdavidmills/to-do-notifications/tree/gh-pages"><font><font>การแจ้งเตือนสิ่งที่ต้องทำ</font></font></a><font><font> ( </font></font><a class="external" href="http://mdn.github.io/to-do-notifications/"><font><font>ดูตัวอย่างสด</font></font></a><font><font> ): แอ็พพลิเคชันอ้างอิงสำหรับตัวอย่างในเอกสารอ้างอิง</font></font></li> - <li><a class="external" href="http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/"><font><font>จัดเก็บภาพและไฟล์ใน IndexedDB</font></font></a></li> -</ul> - -<h2 id="ข้อมูลจำเพาะ"><font><font>ข้อมูลจำเพาะ</font></font></h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col"><font><font>สเปค</font></font></th> - <th scope="col"><font><font>สถานะ</font></font></th> - <th scope="col"><font><font>คิดเห็น</font></font></th> - </tr> - <tr> - <td><font><font>{{SpecName ( 'IndexedDB')}}</font></font></td> - <td><font><font>{{Spec2 ( 'IndexedDB')}}</font></font></td> - <td><font><font>ความหมายเบื้องต้น</font></font></td> - </tr> - <tr> - <td><font><font>{{SpecName ("IndexedDB 2")}}</font></font></td> - <td><font><font>{{Spec2 ("IndexedDB 2")}}</font></font></td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="ความเข้ากันได้ของเบราเซอร์"><font><font>ความเข้ากันได้ของเบราเซอร์</font></font></h2> - -<p><font><font>{{CompatibilityTable}}</font></font></p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th><font><font>ลักษณะ</font></font></th> - <th><font><font>โครเมียม</font></font></th> - <th><font><font>ขอบ</font></font></th> - <th><font><font>Firefox (ตุ๊กแก)</font></font></th> - <th><font><font>Internet Explorer</font></font></th> - <th><font><font>อุปรากร</font></font></th> - <th><font><font>Safari (WebKit)</font></font></th> - </tr> - <tr> - <td><font><font>การสนับสนุนขั้นพื้นฐาน</font></font></td> - <td><font><font>{{CompatChrome (23)}} {{property_prefix ("webkit")}} </font></font><br> - <font><font>{{CompatChrome (24)}} (ไม่เป็นที่รู้จัก) </font></font><br> - <font><font>{{CompatChrome (38)}} (คำนำหน้าเลิกใช้แล้ว) </font></font><br> - <font><font>{{CompatChrome (57)}} ( คำนำหน้านำออก)</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatGeckoDesktop ("10.0")}} {{property_prefix ("moz")}} </font></font><br> - <font><font>{{CompatGeckoDesktop ("16.0")}}</font></font></td> - <td><font><font>10</font></font></td> - <td><font><font>15</font></font></td> - <td> - <p><font><font>7.1 ส่วนที่</font></font><br> - <font><font>10</font></font></p> - </td> - </tr> - <tr> - <td><font><font>มีอยู่ในคนงาน</font></font></td> - <td><font><font>{{CompatVersionUnknown}} (ไม่เป็นตัวเป็นตน) </font></font><br> - <font><font>{{CompatChrome (38)}} (คำนำหน้าเลิกใช้แล้ว) </font></font><br> - <font><font>{{CompatChrome (57)}} (นำหน้านำหน้าออก)</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatGeckoDesktop ("37.0")}} </font></font><sup><font><font>[1]</font></font></sup></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>10</font></font></td> - </tr> - <tr> - <td><font><font>ใช้ได้ในโหมดความเป็นส่วนตัว</font></font><sup><font><font>[3]</font></font></sup></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - </tr> - <tr> - <td><code>IDBLocaleAwareKeyRange</code></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatGeckoDesktop ("43.0")}} </font></font><sup><font><font>[2]</font></font></sup></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - </tr> - <tr> - <td><font><font>ฐานข้อมูลที่ทำดัชนี 2.0</font></font></td> - <td><font><font>{{CompatChrome (58)}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - <td><font><font>{{CompatOpera (45)}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th><font><font>ลักษณะ</font></font></th> - <th><font><font>Android Webview</font></font></th> - <th><font><font>Chrome สำหรับแอนดรอยด์</font></font></th> - <th><font><font>ขอบ</font></font></th> - <th><font><font>Firefox Mobile (ตุ๊กแก)</font></font></th> - <th><font><font>Firefox OS</font></font></th> - <th><font><font>โทรศัพท์ IE / Edge</font></font></th> - <th><font><font>Opera Mobile</font></font></th> - <th><font><font>Safari มือถือ</font></font></th> - </tr> - <tr> - <td><font><font>การสนับสนุนขั้นพื้นฐาน</font></font></td> - <td><font><font>{{CompatVersionUnknown}} (ไม่เป็นตัวเป็นตน) </font></font><br> - <font><font>{{CompatChrome (38)}} (คำนำหน้าเลิกใช้แล้ว) </font></font><br> - <font><font>{{CompatChrome (57)}} (นำหน้านำหน้าออก)</font></font></td> - <td><font><font>{{CompatVersionUnknown}} (ไม่เป็นตัวเป็นตน) </font></font><br> - <font><font>{{CompatChrome (38)}} (คำนำหน้าเลิกใช้แล้ว) </font></font><br> - <font><font>{{CompatChrome (57)}} (นำหน้านำหน้าออก)</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatGeckoMobile ( "22.0")}}</font></font></td> - <td><font><font>1.0.1</font></font></td> - <td><font><font>10</font></font></td> - <td><font><font>{{CompatOpera (22)}}</font></font></td> - <td><font><font>8 บางส่วน</font></font><br> - <font><font>10</font></font></td> - </tr> - <tr> - <td><font><font>มีอยู่ในคนงาน</font></font></td> - <td><font><font>{{CompatVersionUnknown}} (ไม่เป็นตัวเป็นตน) </font></font><br> - <font><font>{{CompatChrome (38)}} (คำนำหน้าเลิกใช้แล้ว) </font></font><br> - <font><font>{{CompatChrome (57)}} (นำหน้านำหน้าออก)</font></font></td> - <td><font><font>{{CompatVersionUnknown}} (ไม่เป็นตัวเป็นตน) </font></font><br> - <font><font>{{CompatChrome (38)}} (คำนำหน้าเลิกใช้แล้ว) </font></font><br> - <font><font>{{CompatChrome (57)}} (นำหน้านำหน้าออก)</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatGeckoMobile ("37.0")}} </font></font><sup><font><font>[1]</font></font></sup></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>{{CompatVersionUnknown}}</font></font></td> - <td><font><font>10</font></font></td> - </tr> - <tr> - <td><font><font>ใช้ได้ในโหมดความเป็นส่วนตัว</font></font><sup><font><font>[3]</font></font></sup></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - </tr> - <tr> - <td><code>IDBLocaleAwareKeyRange</code></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatGeckoMobile ("43.0")}} </font></font><sup><font><font>[2]</font></font></sup></td> - <td><font><font>2.5 </font></font><sup><font><font>[2]</font></font></sup></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - <td><font><font>{{CompatNo}}</font></font></td> - </tr> - <tr> - <td><font><font>ฐานข้อมูลที่ทำดัชนี 2.0</font></font></td> - <td><font><font>{{CompatChrome (58)}}</font></font></td> - <td><font><font>{{CompatChrome (58)}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - <td><font><font>{{CompatOpera (45)}}</font></font></td> - <td><font><font>{{CompatUnknown}}</font></font></td> - </tr> - </tbody> -</table> -</div> - -<ul> - <li><font><font>[1] {{domxref ("IDBCursorWithValue")}} ไม่สามารถใช้งานได้จนกว่า Gecko 42.0 {{geckoRelease ("42.0")}}</font></font></li> - <li><font><font>[2] คุณลักษณะนี้ซ่อนอยู่หลังธงเพื่อเปิดใช้งานและทดสอบไปที่ about: config และเปิดใช้งาน dom.indexedDB.experimental</font></font></li> - <li><font><font>[3] อาคา "โหมดการดูส่วนตัว" (Firefox) และ "ไม่ระบุตัวตน" (Chrome)</font></font></li> -</ul> - -<h2 id="ดูสิ่งนี้ด้วย"><font><font>ดูสิ่งนี้ด้วย</font></font></h2> - -<ul> - <li><a class="external" href="https://github.com/localForage/localForage"><font><font>localForage</font></font></a><font><font> : Polyfill ให้ชื่อแบบง่าย: ไวยากรณ์ค่าสำหรับการจัดเก็บข้อมูลฝั่งไคลเอ็นต์ซึ่งใช้ IndexedDB ในเบื้องหลัง แต่จะกลับไปใช้ WebSQL และจากนั้นจัดเก็บในเครื่องในเบราว์เซอร์ที่ไม่สนับสนุน IndexedDB</font></font></li> - <li><a class="external" href="http://www.dexie.org/"><font><font>dexie.js</font></font></a><font><font> : wrapper สำหรับ IndexedDB ที่ช่วยให้สามารถพัฒนาโค้ดได้เร็วขึ้นโดยใช้ไวยากรณ์ที่ดีและเรียบง่าย</font></font></li> - <li><a href="https://github.com/erikolson186/zangodb"><font><font>ZangoDB</font></font></a><font><font> : อินเทอร์เฟซสำหรับ MongoDB สำหรับ IndexedDB ที่สนับสนุนการกรอง, การฉาย, การเรียงลำดับ, การอัพเดทและการรวมตัวของ MongoDB ที่คุ้นเคย</font></font></li> - <li><a href="http://jsstore.net/"><font><font>JsStore </font></font></a><span style='background-color: #ffffff; color: #333333; display: inline !important; float: none; font-family: "Open Sans",arial,x-locale-body,sans-serif; font-size: medium; font-style: normal; font-weight: normal; letter-spacing: normal; text-align: left; text-decoration-style: initial; text-indent: 0px; text-transform: none; white-space: normal;'><font><font>: เสื้อคลุม IndexedDB มีไวยากรณ์ SQL เหมือน</font></font></span></li> -</ul> diff --git a/files/th/web/api/location/index.html b/files/th/web/api/location/index.html deleted file mode 100644 index 0e1ae33f89..0000000000 --- a/files/th/web/api/location/index.html +++ /dev/null @@ -1,217 +0,0 @@ ---- -title: Location -slug: Web/API/Location -tags: - - API - - HTML DOM - - Interface - - Location - - NeedsTranslation - - Reference - - TopicStub -translation_of: Web/API/Location ---- -<p>{{APIRef("HTML DOM")}}</p> - -<p>The <strong><code>Location</code></strong> interface represents the location (URL) of the object it is linked to. Changes done on it are reflected on the object it relates to. Both the {{domxref("Document")}} and {{domxref("Window")}} interface have such a linked <code>Location</code>, accessible via {{domxref("Document.location")}} and {{domxref("Window.location")}} respectively.</p> - -<h2 id="Properties">Properties</h2> - -<p><em>The <code>Location</code></em><em> interface doesn't inherit any property, but implements those from {{domxref("URLUtils")}}.</em></p> - -<dl> - <dt>{{domxref("Location.href")}}</dt> - <dd>Is a {{domxref("DOMString")}} containing the entire URL. If changed, the associated document navigates to the new page. It can be set from a different origin than the associated document.</dd> - <dt>{{domxref("Location.protocol")}}</dt> - <dd>Is a {{domxref("DOMString")}} containing the protocol scheme of the URL, including the final <code>':'</code>.</dd> - <dt>{{domxref("Location.host")}}</dt> - <dd>Is a {{domxref("DOMString")}} containing the host, that is the <em>hostname</em>, a <code>':'</code>, and the <em>port</em> of the URL.</dd> - <dt>{{domxref("Location.hostname")}}</dt> - <dd>Is a {{domxref("DOMString")}} containing the domain of the URL.</dd> - <dt>{{domxref("Location.port")}}</dt> - <dd>Is a {{domxref("DOMString")}} containing the port number of the URL.</dd> - <dt>{{domxref("Location.pathname")}}</dt> - <dd>Is a {{domxref("DOMString")}} containing an initial <code>'/'</code> followed by the path of the URL.</dd> - <dt>{{domxref("Location.search")}}</dt> - <dd>Is a {{domxref("DOMString")}} containing a <code>'?'</code> followed by the parameters or "querystring" of the URL. Modern browsers provide <a href="/en-US/docs/Web/API/URLSearchParams/get#Example">URLSearchParams</a> and <a href="/en-US/docs/Web/API/URL/searchParams#Example">URL.searchParams</a> to make it easy to parse out the parameters from the querystring.</dd> - - <dt>{{domxref("Location.hash")}}</dt> - <dd>Is a {{domxref("DOMString")}} containing a <code>'#'</code> followed by the fragment identifier of the URL.</dd> - <dt>{{domxref("Location.username")}}</dt> - <dd>Is a {{domxref("DOMString")}} containing the username specified before the domain name.</dd> - <dt>{{domxref("Location.password")}}</dt> - <dd>Is a {{domxref("DOMString")}} containing the password specified before the domain name.</dd> - <dt>{{domxref("Location.origin")}} {{readOnlyInline}}</dt> - <dd>Returns a {{domxref("DOMString")}} containing the canonical form of the origin of the specific location.</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<p><em>The <code>Location</code></em><em> interface doesn't inherit any method<em>, but implements those from {{domxref("URLUtils")}}</em>.</em></p> - -<dl> - <dt>{{domxref("Location.assign()")}}</dt> - <dd>Loads the resource at the URL provided in parameter.</dd> - <dt>{{domxref("Location.reload()")}}</dt> - <dd>Reloads the resource from the current URL. Its optional unique parameter is a {{domxref("Boolean")}}, which, when it is <code>true</code>, causes the page to always be reloaded from the server. If it is <code>false</code> or not specified, the browser may reload the page from its cache.</dd> - <dt>{{domxref("Location.replace()")}}</dt> - <dd>Replaces the current resource with the one at the provided URL. The difference from the <code>assign()</code> method is that after using <code>replace()</code> the current page will not be saved in session {{domxref("History")}}, meaning the user won't be able to use the <em>back</em> button to navigate to it.</dd> - <dt>{{domxref("Location.toString()")}}</dt> - <dd>Returns a {{domxref("DOMString")}} containing the whole URL. It is a synonym for {{domxref("URLUtils.href")}}, though it can't be used to modify the value.</dd> -</dl> - -<h2 id="Examples">Examples</h2> - -<pre class="brush: js">// Create anchor element and use href property for the purpose of this example -// A more correct alternative is to browse to the URL and use document.location or window.location -var url = document.createElement('a'); -url.href = 'https://developer.mozilla.org:8080/en-US/search?q=URL#search-results-close-container'; -console.log(url.href); // https://developer.mozilla.org:8080/en-US/search?q=URL#search-results-close-container -console.log(url.protocol); // https: -console.log(url.host); // developer.mozilla.org:8080 -console.log(url.hostname); // developer.mozilla.org -console.log(url.port); // 8080 -console.log(url.pathname); // /en-US/search -console.log(url.search); // ?q=URL -console.log(url.hash); // #search-results-close-container -console.log(url.origin); // https://developer.mozilla.org -</pre> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('HTML WHATWG', "browsers.html#the-location-interface", "Location")}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>No change from {{SpecName("HTML5 W3C")}}.</td> - </tr> - <tr> - <td>{{SpecName('HTML5 W3C', "browsers.html#the-location-interface", "Location")}}</td> - <td>{{Spec2('HTML5 W3C')}}</td> - <td>Initial definition.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<p>{{CompatibilityTable}}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Edge</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari (WebKit)</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - <tr> - <td><code>origin</code> on <code>Windows.location</code></td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoDesktop("21")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - <tr> - <td><code>origin</code> on all <code>location</code> objects (but on Workers, that use {{domxref("WorkerLocation")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoDesktop("26")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - <tr> - <td><code>username</code> and <code>password</code></td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoDesktop("26")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Edge</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Phone</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - <tr> - <td><code>origin</code> on <code>Windows.location</code></td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoMobile("21")}}</td> - <td>11</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - <tr> - <td><code>origin</code> on all <code>location</code> objects (but on Workers, that use {{domxref("WorkerLocation")}})</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoMobile("26")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - <tr> - <td><code>username</code> and <code>password</code></td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoMobile("26")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - - </tbody> -</table> -</div> - -<h2 id="See_also">See also</h2> - -<ul> - <li>Two methods creating such an object: {{domxref("Window.location")}} and {{domxref("Document.location")}}.</li> - <li>URL related interfaces: {{domxref("URL")}}, {{domxref("URLSearchParams")}} and {{domxref("HTMLHyperlinkElementUtils")}}</li> -</ul> diff --git a/files/th/web/api/server-sent_events/index.html b/files/th/web/api/server-sent_events/index.html deleted file mode 100644 index 7430312328..0000000000 --- a/files/th/web/api/server-sent_events/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: Server-sent events -slug: Web/API/Server-sent_events -translation_of: Web/API/Server-sent_events ---- -<p>{{DefaultAPISidebar("เซิร์ฟเวอร์ส่งเหตุการณ์")}}</p> - -<p>ตามเนื้อผ้าหน้าเว็บต้องส่งคำขอไปยังเซิร์ฟเวอร์เพื่อรับข้อมูลใหม่ นั่นคือหน้าร้องขอข้อมูลจากเซิร์ฟเวอร์ ด้วยเหตุการณ์ที่เซิร์ฟเวอร์ส่งเป็นไปได้ที่เซิร์ฟเวอร์จะส่งข้อมูลใหม่ไปยังหน้าเว็บได้ตลอดเวลาโดยการส่งข้อความไปยังหน้าเว็บ ข้อความขาเข้าเหล่านี้สามารถใช้เป็น<em>ข้อมูล</em><em><a href="/en-US/docs/DOM/event">กิจกรรม</a> +</em>ในหน้าเว็บ</p> - -<h2 id="แนวคิดและการใช้งาน">แนวคิดและการใช้งาน</h2> - -<p>เพื่อเรียนรู้วิธีการใช้เหตุการณ์เซิร์ฟเวอร์ส่งดูบทความของเราใช้เหตุการณ์เซิร์ฟเวอร์ส่ง</p> - -<h2 id="Interfaces" name="Interfaces">อินเตอร์เฟซ</h2> - -<dl> - <dt>{{domxref("EventSource")}}</dt> - <dd>กำหนดคุณสมบัติทั้งหมดที่จัดการการเชื่อมต่อกับเซิร์ฟเวอร์การรับเหตุการณ์ / ข้อมูลข้อผิดพลาดการปิดการเชื่อมต่อ ฯลฯ</dd> -</dl> - -<h2 id="ตัวอย่าง">ตัวอย่าง</h2> - -<ul> - <li><a href="https://github.com/mdn/dom-examples/tree/master/server-sent-events">Simple SSE demo โดยใช้ PHP</a></li> -</ul> - -<h2 id="สเปค">สเปค</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">สเปค</th> - <th scope="col">สถานะ</th> - <th scope="col">คิดเห็น</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName ('HTML WHATWG', '# server-sent-events', 'เหตุการณ์ที่เซิร์ฟเวอร์ส่ง')}}</td> - <td>{{Spec2 ('HTML WHATWG')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="See_also" name="See_also">ดูสิ่งนี้ด้วย</h2> - -<h3 id="Tools" name="Tools">เครื่องมือ</h3> - -<ul> - <li><a href="https://github.com/EventSource/eventsource">EventSource polyfill สำหรับ Node.js</a></li> - <li>โพลีฟิลล์<a class="link-https" href="https://github.com/remy/polyfills/blob/master/EventSource.js">EventSource</a>ของชาร์ปของ Remy</li> - <li><a class="link-https" href="https://github.com/Yaffle/EventSource" title="https://github.com/Yaffle/EventSource">EventSource</a> Polyfill ของ Yaffle</li> - <li><a class="link-https" href="https://github.com/rwldrn/jquery.eventsource">ปลั๊กอิน jquery</a>ของ Rick Waldron</li> - <li>intercooler.js <a href="http://intercoolerjs.org/docs.html#sse">สนับสนุน SSE ที่เปิดเผย</a></li> -</ul> - -<h3 id="Related_Topics" name="Related_Topics">หัวข้อที่เกี่ยวข้อง</h3> - -<ul> - <li><a href="/en-US/docs/AJAX" title="AJAX">AJAX</a></li> - <li><a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a></li> - <li><a href="/en-US/docs/WebSockets" title="WebSockets">WebSockets</a></li> -</ul> - -<h3 id="แหล่งข้อมูลอื่น_ๆ">แหล่งข้อมูลอื่น ๆ</h3> - -<ul> - <li><a href="http://hacks.mozilla.org/2011/06/a-wall-powered-by-eventsource-and-server-sent-events/" title="http://hacks.mozilla.org/2011/06/a-wall-powered-by-eventsource-and-server-sent-events/">ทวิตเตอร์เช่นเดียวกับโปรแกรม</a>ที่ขับเคลื่อนโดยเหตุการณ์เซิร์ฟเวอร์ที่ส่งและ<a class="link-https" href="https://github.com/mozilla/webowonder-demos/tree/master/demos/friends%20timeline" title="https://github.com/mozilla/webowonder-demos/tree/master/demos/friends ไทม์ไลน์">รหัสบน </a>Github</li> - <li><a href="http://dsheiko.com/weblog/html5-and-server-sent-events" title="http://dsheiko.com/weblog/html5-and-server-sent-events">เหตุการณ์ HTML5 และเซิร์ฟเวอร์ที่ส่ง</a></li> - <li><a href="http://rajudasa.blogspot.in/2012/05/html5-server-sent-events-using-aspnet.html" title="http://rajudasa.blogspot.in/2012/05/html5-server-sent-events-using-aspnet.html">เหตุการณ์ที่เซิร์ฟเวอร์ส่งโดยใช้ Asp.Net</a></li> -</ul> diff --git a/files/th/web/api/webgl_api/index.html b/files/th/web/api/webgl_api/index.html deleted file mode 100644 index 5b2a88ef9e..0000000000 --- a/files/th/web/api/webgl_api/index.html +++ /dev/null @@ -1,253 +0,0 @@ ---- -title: 'WebGL: 2D and 3D graphics for the web' -slug: Web/API/WebGL_API -translation_of: Web/API/WebGL_API ---- -<div><font><font>{{WebGLSidebar}}</font></font></div> - -<div class="summary"> -<p><span class="seoSummary"><font><font>WebGL (ห้องสมุดกราฟิกเว็บ) เป็น JavaScript API สำหรับการแสดงผลกราฟิก 3 มิติและ 2D แบบโต้ตอบที่มีประสิทธิภาพสูงภายในเว็บเบราว์เซอร์ที่รองรับโดยไม่ต้องใช้ปลั๊กอิน </font><font>WebGL ทำได้โดยการแนะนำ API ที่สอดคล้องกับ OpenGL ES 2.0 อย่างใกล้ชิดซึ่งสามารถใช้ในองค์ประกอบ HTML5 {{HTMLElement ("canvas")}} </font></font></span><font><font>ความสอดคล้องนี้ทำให้ API สามารถได้รับประโยชน์จากการเร่งความเร็วของกราฟิกฮาร์ดแวร์ที่อุปกรณ์ของผู้ใช้ใช้</font></font></p> -</div> - -<p><font><font>รองรับ WebGL ใน</font></font><a href="/en-US/Firefox" title="Firefox 4 สำหรับนักพัฒนา"><font><font>Firefox</font></font></a><font><font> 4+, </font></font><a href="https://www.google.com/chrome/"><font><font>Google Chrome</font></font></a><font><font> 9+, </font></font><a href="https://www.opera.com/"><font><font>Opera</font></font></a><font><font> 12+, </font></font><a href="https://www.apple.com/safari/"><font><font>Safari</font></font></a><font><font> 5.1+, </font></font><a href="http://windows.microsoft.com/en-us/internet-explorer/browser-ie"><font><font>Internet Explorer</font></font></a><font><font> 11+ </font><font>และ</font></font><a href="https://www.microsoft.com/en-us/edge"><font><font>Microsoft Edge</font></font></a><font><font> build 10240+; </font><font>อย่างไรก็ตามอุปกรณ์ของผู้ใช้จะต้องมีฮาร์ดแวร์ที่รองรับคุณสมบัติเหล่านี้</font></font></p> - -<p><font><font>{{anch ("WebGL 2")}} API แนะนำการสนับสนุนชุดคุณลักษณะ OpenGL ES 3.0 เป็นส่วนใหญ่ </font><font>มีให้ผ่านทาง {{domxref ("WebGL2RenderingContext")}} ส่วนต่อประสาน</font></font></p> - -<p><font><font>องค์ประกอบ {{HTMLElement ("canvas")}} ยังถูกใช้โดย</font></font><a href="/en-US/docs/Web/API/Canvas_API"><font><font>Canvas API</font></font></a><font><font>เพื่อทำกราฟิก 2D บนหน้าเว็บ</font></font></p> - -<h2 id="การอ้างอิง"><font><font>การอ้างอิง</font></font></h2> - -<h3 id="อินเตอร์เฟสมาตรฐาน"><font><font>อินเตอร์เฟสมาตรฐาน</font></font></h3> - -<div class="index"> -<ul> - <li><font><font>{{domxref ( "WebGLRenderingContext")}}</font></font></li> - <li><font><font>{{domxref ( "WebGL2RenderingContext")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLActiveInfo")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLBuffer")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLContextEvent")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLFramebuffer")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLProgram")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLQuery")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLRenderbuffer")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLSampler")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLShader")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLShaderPrecisionFormat")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLSync")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLTexture")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLTransformFeedback")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLUniformLocation")}}</font></font></li> - <li><font><font>{{domxref ( "WebGLVertexArrayObject")}}</font></font></li> -</ul> -</div> - -<h3 id="ส่วนขยาย"><font><font>ส่วนขยาย</font></font></h3> - -<div class="index"> -<ul> - <li><font><font>{{domxref ( "ANGLE_instanced_arrays")}}</font></font></li> - <li><font><font>{{domxref ( "EXT_blend_minmax")}}</font></font></li> - <li><font><font>{{domxref ( "EXT_color_buffer_float")}}</font></font></li> - <li>{{domxref("EXT_color_buffer_half_float")}}</li> - <li>{{domxref("EXT_disjoint_timer_query")}}</li> - <li>{{domxref("EXT_float_blend")}} {{experimental_inline}}</li> - <li>{{domxref("EXT_frag_depth")}}</li> - <li>{{domxref("EXT_sRGB")}}</li> - <li>{{domxref("EXT_shader_texture_lod")}}</li> - <li>{{domxref("EXT_texture_compression_bptc")}}</li> - <li>{{domxref("EXT_texture_compression_rgtc")}}</li> - <li>{{domxref("EXT_texture_filter_anisotropic")}}</li> - <li>{{domxref("OES_element_index_uint")}}</li> - <li>{{domxref("OES_fbo_render_mipmap")}}</li> - <li>{{domxref("OES_standard_derivatives")}}</li> - <li>{{domxref("OES_texture_float")}}</li> - <li>{{domxref("OES_texture_float_linear")}}</li> - <li>{{domxref("OES_texture_half_float")}}</li> - <li>{{domxref("OES_texture_half_float_linear")}}</li> - <li>{{domxref("OES_vertex_array_object")}}</li> - <li>{{domxref("OVR_multiview2")}}</li> - <li>{{domxref("WEBGL_color_buffer_float")}}</li> - <li>{{domxref("WEBGL_compressed_texture_astc")}}</li> - <li>{{domxref("WEBGL_compressed_texture_atc")}}</li> - <li>{{domxref("WEBGL_compressed_texture_etc")}}</li> - <li>{{domxref("WEBGL_compressed_texture_etc1")}}</li> - <li>{{domxref("WEBGL_compressed_texture_pvrtc")}}</li> - <li>{{domxref("WEBGL_compressed_texture_s3tc")}}</li> - <li>{{domxref("WEBGL_compressed_texture_s3tc_srgb")}}</li> - <li>{{domxref("WEBGL_debug_renderer_info")}}</li> - <li>{{domxref("WEBGL_debug_shaders")}}</li> - <li>{{domxref("WEBGL_depth_texture")}}</li> - <li>{{domxref("WEBGL_draw_buffers")}}</li> - <li>{{domxref("WEBGL_lose_context")}}</li> -</ul> -</div> - -<h3 id="Events">Events</h3> - -<ul> - <li><code><a href="/en-US/docs/Web/API/HTMLCanvasElement/webglcontextlost_event">webglcontextlost</a></code></li> - <li><code><a href="/en-US/docs/Web/API/HTMLCanvasElement/webglcontextrestored_event">webglcontextrestored</a></code></li> - <li><code><a href="/en-US/docs/Web/API/HTMLCanvasElement/webglcontextcreationerror_event">webglcontextcreationerror</a></code></li> -</ul> - -<h3 id="Constants_and_types">Constants and types</h3> - -<ul> - <li><a href="/en-US/docs/Web/API/WebGL_API/Constants">WebGL constants</a></li> - <li><a href="/en-US/docs/Web/API/WebGL_API/Types">WebGL types</a></li> -</ul> - -<h3 id="WebGL_2">WebGL 2</h3> - -<p>WebGL 2 is a major update to WebGL which is provided through the {{domxref("WebGL2RenderingContext")}} interface. It is based on OpenGL ES 3.0 and new features include:</p> - -<ul> - <li><a href="/en-US/docs/Web/API/WebGL2RenderingContext/texImage3D">3D textures</a>,</li> - <li><a href="/en-US/docs/Web/API/WebGLSampler">Sampler objects</a>,</li> - <li><a href="/en-US/docs/Web/API/WebGL2RenderingContext#Uniform_buffer_objects">Uniform Buffer objects</a>,</li> - <li><a href="/en-US/docs/Web/API/WebGLSync">Sync objects</a>,</li> - <li><a href="/en-US/docs/Web/API/WebGLQuery">Query objects</a>,</li> - <li><a href="/en-US/docs/Web/API/WebGLTransformFeedback">Transform Feedback objects</a>,</li> - <li>Promoted extensions that are now core to WebGL 2: <a href="/en-US/docs/Web/API/WebGLVertexArrayObject">Vertex Array objects</a>, <a href="/en-US/docs/Web/API/WebGL2RenderingContext/drawArraysInstanced">instancing</a>, <a href="/en-US/docs/Web/API/WebGL2RenderingContext/drawBuffers">multiple render targets</a>, <a href="/en-US/docs/Web/API/EXT_frag_depth">fragment depth</a>.</li> -</ul> - -<p>See also the blog post <a href="https://hacks.mozilla.org/2017/01/webgl-2-lands-in-firefox/">"WebGL 2 lands in Firefox"</a> and <a href="http://webglsamples.org/WebGL2Samples/">webglsamples.org/WebGL2Samples</a> for a few demos.</p> - -<h2 id="Guides_and_tutorials">Guides and tutorials</h2> - -<p>Below, you'll find an assortment of guides to help you learn WebGL concepts and tutorials that offer step-by-step lessons and examples.</p> - -<h3 id="Guides">Guides</h3> - -<dl> - <dt><a href="/en-US/docs/Web/API/WebGL_API/Data">Data in WebGL</a></dt> - <dd>A guide to variables, buffers, and other types of data used when writing WebGL code.</dd> - <dt><a href="/en-US/docs/Web/API/WebGL_API/WebGL_best_practices">WebGL best practices</a></dt> - <dd>Tips and suggestions to help you improve the quality, performance, and reliability of your WebGL content.</dd> - <dt><a href="/en-US/docs/Web/API/WebGL_API/Using_Extensions">Using extensions</a></dt> - <dd>A guide to using WebGL extensions.</dd> -</dl> - -<h3 id="Tutorials">Tutorials</h3> - -<dl> - <dt><a href="/en-US/docs/Web/API/WebGL_API/Tutorial">WebGL tutorial</a></dt> - <dd>A beginner's guide to WebGL core concepts. A good place to start if you don't have previous WebGL experience.</dd> -</dl> - -<h3 id="Examples">Examples</h3> - -<dl> - <dt><a href="/en-US/docs/Web/API/WebGL_API/Basic_2D_animation_example">A basic 2D WebGL animation example</a></dt> - <dd>This example demonstrates the simple animation of a one-color shape. Topics examined are adapting to aspect ratio differences, a function to build shader programs from sets of multiple shaders, and the basics of drawing in WebGL.</dd> - <dt><a href="/en-US/docs/Web/API/WebGL_API/By_example">WebGL by example</a></dt> - <dd><font><font>ชุดตัวอย่างสดพร้อมคำอธิบายสั้น ๆ ที่แสดงแนวคิดและความสามารถของ WebGL </font><font>ตัวอย่างจะถูกจัดเรียงตามหัวข้อและระดับความยากซึ่งครอบคลุมบริบทการเรนเดอร์ WebGL, การโปรแกรม shader, พื้นผิว, เรขาคณิต, การโต้ตอบกับผู้ใช้และอื่น ๆ</font></font></dd> -</dl> - -<h3 id="บทเรียนขั้นสูง"><font><font>บทเรียนขั้นสูง</font></font></h3> - -<dl> - <dt><a href="/en-US/docs/Web/API/WebGL_API/WebGL_model_view_projection"><font><font>การฉายมุมมองโมเดล WebGL</font></font></a></dt> - <dd><font><font>คำอธิบายโดยละเอียดของเมทริกซ์หลักสามตัวที่โดยทั่วไปใช้เพื่อแสดงมุมมองวัตถุสามมิติ: แบบจำลองมุมมองและเมทริกซ์การฉายภาพ</font></font></dd> - <dt><a href="/en-US/docs/Web/API/WebGL_API/Matrix_math_for_the_web"><font><font>คณิตศาสตร์เมทริกซ์สำหรับเว็บ</font></font></a></dt> - <dd><font><font>คู่มือที่มีประโยชน์เกี่ยวกับการทำงานของเมทริกซ์การแปลง 3D และสามารถใช้บนเว็บได้ - ทั้งสำหรับการคำนวณ WebGL และในการแปลง CSS3</font></font></dd> -</dl> - -<h2 id="ทรัพยากร"><font><font>ทรัพยากร</font></font></h2> - -<ul> - <li><a href="https://www.youtube.com/embed/H4c8t6myAWU/?feature=player_detailpage"><font><font>Raw WebGL: คำแนะนำเกี่ยวกับ WebGL</font></font></a><font><font>คำ</font><a href="https://www.youtube.com/embed/H4c8t6myAWU/?feature=player_detailpage"><font>บรรยาย</font></a><font>โดย Nick Desaulniers ที่แนะนำพื้นฐานของ WebGL </font><font>นี่เป็นจุดเริ่มต้นที่ดีหากคุณไม่เคยเขียนโปรแกรมกราฟิกระดับต่ำมาก่อน</font></font></li> - <li><a href="http://www.khronos.org/webgl/" title="http://www.khronos.org/webgl/"><font><font>เว็บไซต์ Khronos WebGL เว็บไซต์</font></font></a><font><font>หลักสำหรับ WebGL ที่ Khronos Group</font></font></li> - <li><a href="http://www.html5rocks.com/en/tutorials/webgl/webgl_fundamentals/" title="http://www.html5rocks.com/en/tutorials/webgl/webgl_fundamentals/"><font><font>WebGL Fundamentals</font></font></a><font><font>บทช่วยสอนพื้นฐานพร้อมพื้นฐานของ WebGL</font></font></li> - <li><a href="http://webglplayground.net" title="http://webglplayground.net"><font><font>สนามเด็กเล่น WebGL</font></font></a><font><font>เครื่องมือออนไลน์สำหรับการสร้างและแบ่งปันโครงการ WebGL </font><font>เหมาะสำหรับการสร้างต้นแบบอย่างรวดเร็วและการทดสอบ</font></font></li> - <li><a href="http://www.webglacademy.com" title="http://www.webglacademy.com"><font><font>WebGL Academy</font></font></a><font><font>เครื่องมือแก้ไข HTML / JavaScript พร้อมบทช่วยสอนเพื่อเรียนรู้พื้นฐานของการเขียนโปรแกรม webgl</font></font></li> - <li><a href="http://webglstats.com/"><font><font>สถิติ WebGL</font></font></a><font><font>เว็บไซต์ที่มีสถิติเกี่ยวกับความสามารถของ WebGL ในเบราว์เซอร์บนแพลตฟอร์มต่างๆ</font></font></li> -</ul> - -<h3 id="ห้องสมุด"><font><font>ห้องสมุด</font></font></h3> - -<ul> - <li><a class="link-https" href="https://github.com/toji/gl-matrix" title="https://github.com/toji/gl-matrix"><font><font>glMatrix</font></font></a><font><font>เป็นเมทริกซ์ JavaScript และไลบรารีเวกเตอร์สำหรับแอป WebGL ประสิทธิภาพสูง</font></font></li> - <li><a href="http://senchalabs.github.com/philogl/"><font><font>PhiloGL</font></font></a><font><font>เป็นเฟรมเวิร์ก WebGL สำหรับการสร้างภาพข้อมูลการสร้างโค้ดและการพัฒนาเกม</font></font></li> - <li><a href="http://www.pixijs.com/"><font><font>Pixi.js</font></font></a><font><font>เป็นตัวเรนเดอร์ WebGL 2D แบบโอเพนซอร์สที่รวดเร็วและรวดเร็ว</font></font></li> - <li><a href="https://playcanvas.com/"><font><font>PlayCanvas</font></font></a><font><font>เป็น</font><font>นเกมโอเพนซอร์ซ</font></font></li> - <li><a href="http://sylvester.jcoglan.com/" title="http://sylvester.jcoglan.com/"><font><font>Sylvester</font></font></a><font><font>เป็นห้องสมุดโอเพนซอร์ซสำหรับจัดการเวกเตอร์และเมทริกซ์ </font><font>ไม่ได้รับการปรับให้เหมาะสมกับ WebGL แต่มีความแข็งแกร่งมาก</font></font></li> - <li><a href="https://threejs.org/"><font><font>three.js</font></font></a><font><font>เป็นไลบรารี 3D WebGL แบบโอเพนซอร์สที่มีคุณลักษณะครบถ้วน</font></font></li> - <li><a href="https://phaser.io/"><font><font>Phaser</font></font></a><font><font>เป็นเฟรมเวิร์กโอเพนซอร์สที่รวดเร็วและสนุกสำหรับเกมเบราว์เซอร์ที่ขับเคลื่อนด้วย Canvas และ WebGL</font></font></li> - <li><a href="https://github.com/redcamel/RedGL2"><font><font>RedGL</font></font></a><font><font> เป็นไลบรารี 3D WebGL แบบโอเพ่นซอร์ส</font></font></li> - <li><a href="https://kitware.github.io/vtk-js/"><font><font>vtk.js</font></font></a><font><font> เป็นห้องสมุด JavaScript สำหรับการสร้างภาพทางวิทยาศาสตร์ในเบราว์เซอร์ของคุณ</font></font></li> -</ul> - -<h2 id="ข้อมูลจำเพาะ"><font><font>ข้อมูลจำเพาะ</font></font></h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col"><font><font>สเปค</font></font></th> - <th scope="col"><font><font>สถานะ</font></font></th> - <th scope="col"><font><font>คิดเห็น</font></font></th> - </tr> - </thead> - <tbody> - <tr> - <td><font><font>{{SpecName ( 'WebGL')}}</font></font></td> - <td><font><font>{{Spec2 ( 'WebGL')}}</font></font></td> - <td><font><font>คำจำกัดความเบื้องต้น </font><font>อ้างอิงจาก OpenGL ES 2.0</font></font></td> - </tr> - <tr> - <td><font><font>{{SpecName ( 'WebGL2')}}</font></font></td> - <td><font><font>{{Spec2 ( 'WebGL2')}}</font></font></td> - <td><font><font>สร้างบน WebGL 1. ขึ้นอยู่กับ OpenGL ES 3.0</font></font></td> - </tr> - <tr> - <td><font><font>{{SpecName ('OpenGL ES 2.0')}}</font></font></td> - <td><font><font>{{Spec2 ('OpenGL ES 2.0')}}</font></font></td> - <td></td> - </tr> - <tr> - <td>{{SpecName('OpenGL ES 3.0')}}</td> - <td>{{Spec2('OpenGL ES 3.0')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<h3 id="WebGL_1">WebGL 1</h3> - -<div> - - -<p>{{Compat("api.WebGLRenderingContext", 0)}}</p> - -<h3 id="WebGL_2_2">WebGL 2</h3> - -<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> - -<p>{{Compat("api.WebGL2RenderingContext", 0)}}</p> -</div> - -<h3 id="Compatibility_notes">Compatibility notes</h3> - -<p><font><font>นอกเหนือจากเบราว์เซอร์แล้ว GPU เองยังต้องการการสนับสนุนคุณสมบัติ </font><font>ตัวอย่างเช่น S3 การบีบอัดพื้นผิว (S3TC) มีเฉพาะในแท็บเล็ตที่ใช้ Tegra เท่านั้น </font><font>เบราว์เซอร์ส่วนใหญ่ทำให้บริบท WebGL พร้อมใช้งานผ่าน</font></font><code>webgl</code><font><font>ชื่อบริบท แต่</font><font>เบราว์เซอร์ที่</font><font>เก่ากว่านั้นต้องการ</font></font><code>experimental-webgl</code><font><font>เช่นกัน </font><font>นอกจากนี้การที่จะเกิดขึ้น</font></font><a href="/en-US/docs/Web/API/WebGL2RenderingContext"><font><font>WebGL 2</font></font></a><code>webgl2</code><font><font>เป็นอย่างถอยหลังได้และจะมีชื่อบริบท</font></font></p> - -<h3 id="บันทึกตุ๊กแก"><font><font>บันทึกตุ๊กแก</font></font></h3> - -<h4 id="การแก้ไขข้อบกพร่องและการทดสอบ_WebGL"><font><font>การแก้ไขข้อบกพร่องและการทดสอบ WebGL</font></font></h4> - -<p><font><font>เริ่มต้นด้วย Gecko 10.0 {{geckoRelease ("10.0")}} มีการตั้งค่าสองแบบที่ให้คุณควบคุมความสามารถของ WebGL สำหรับการทดสอบ:</font></font></p> - -<dl> - <dt><code>webgl.min_capability_mode</code></dt> - <dd><font><font>คุณสมบัติบูลีนที่เมื่อ</font></font><code>true</code><font><font>เปิดใช้งานโหมดความสามารถขั้นต่ำ </font><font>เมื่ออยู่ในโหมดนี้ WebGL จะได้รับการกำหนดค่าให้สนับสนุนชุดคุณลักษณะขั้นต่ำเปลือยและความสามารถที่จำเป็นตามข้อกำหนด WebGL เท่านั้น </font><font>วิธีนี้ช่วยให้คุณมั่นใจได้ว่ารหัส WebGL ของคุณจะทำงานบนอุปกรณ์หรือเบราว์เซอร์ใด ๆ โดยไม่คำนึงถึงความสามารถของพวกเขา </font><font>นี่คือ</font></font><code>false</code><font><font>ค่าเริ่มต้น</font></font></dd> - <dt><code>webgl.disable_extensions</code></dt> - <dd><font><font>คุณสมบัติบูลีนที่เมื่อ</font></font><code>true</code><font><font>ปิดใช้งานส่วนขยาย WebGL ทั้งหมด </font><font>นี่คือ</font></font><code>false</code><font><font>ค่าเริ่มต้น</font></font></dd> -</dl> - -<h2 id="ดูสิ่งนี้ด้วย"><font><font>ดูสิ่งนี้ด้วย</font></font></h2> - -<ul> - <li><a href="/en-US/docs/Web/API/Canvas_API"><font><font>Canvas API</font></font></a></li> - <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/getSupportedExtensions#Browser_compatibility"><font><font>ข้อมูลความเข้ากันได้เกี่ยวกับส่วนขยาย WebGL</font></font></a></li> -</ul> diff --git a/files/th/web/api/websockets_api/index.html b/files/th/web/api/websockets_api/index.html deleted file mode 100644 index fe713179a4..0000000000 --- a/files/th/web/api/websockets_api/index.html +++ /dev/null @@ -1,101 +0,0 @@ ---- -title: The WebSocket API (WebSockets) -slug: Web/API/WebSockets_API -translation_of: Web/API/WebSockets_API ---- -<p>{{DefaultAPISidebar("Websockets API")}}</p> - -<p>The <strong>WebSocket API</strong> is an advanced technology that makes it possible to open a two-way interactive communication session between the user's browser and a server. With this API, you can send messages to a server and receive event-driven responses without having to poll the server for a reply.</p> - -<div class="blockIndicator note"> -<p><strong>Note:</strong> While a WebSocket connection is functionally somewhat similar to standard Unix-style sockets, they are not related.</p> -</div> - -<h2 id="Interfaces">Interfaces</h2> - -<dl> - <dt><a href="/en-US/docs/Web/API/WebSocket"><code>WebSocket</code></a></dt> - <dd>The primary interface for connecting to a WebSocket server and then sending and receiving data on the connection.</dd> - <dt><code><a href="/en-US/docs/Web/API/CloseEvent">CloseEvent</a></code></dt> - <dd>The event sent by the WebSocket object when the connection closes.</dd> - <dt><a href="/en-US/docs/Web/API/MessageEvent"><code>MessageEvent</code></a></dt> - <dd>The event sent by the WebSocket object when a message is received from the server.</dd> -</dl> - -<h2 id="Guides">Guides</h2> - -<ul> - <li><a href="/en-US/docs/Web/API/WebSockets_API/Writing_WebSocket_client_applications">Writing WebSocket client applications</a></li> - <li><a href="/en-US/docs/Web/API/WebSockets_API/Writing_WebSocket_servers">Writing WebSocket servers</a></li> - <li><a href="/en-US/docs/Web/API/WebSockets_API/Writing_WebSocket_server">Writing a WebSocket server in C#</a></li> - <li><a href="/en-US/docs/Web/API/WebSockets_API/Writing_a_WebSocket_server_in_Java">Writing a WebSocket server in Java</a></li> -</ul> - -<h2 id="Tools" name="Tools">Tools</h2> - -<ul> - <li><a href="https://hacks.mozilla.org/2017/06/introducing-humblenet-a-cross-platform-networking-library-that-works-in-the-browser/">HumbleNet</a>: A cross-platform networking library that works in the browser. It consists of a C wrapper around WebSockets and WebRTC that abstracts away cross-browser differences, facilitating the creation of multi-user networking functionality for games and other apps.</li> - <li><a href="https://github.com/uWebSockets/uWebSockets">µWebSockets</a>: Highly scalable WebSocket server and client implementation for <a href="https://isocpp.org/">C++11</a> and <a href="https://nodejs.org">Node.js</a>.</li> - <li><a href="https://github.com/ClusterWS/ClusterWS">ClusterWS</a>: Lightweight, fast and powerful framework for building scalable WebSocket applications in <a href="https://nodejs.org">Node.js</a>.</li> - <li><a href="https://github.com/ClusterWS/cWS">CWS</a>: Fast C++ WebSocket implementation for Node.js (uWebSockets v0.14 fork)</li> - <li><a class="external" href="https://socket.io">Socket.IO</a>: A long polling/WebSocket based third party transfer protocol for <a href="https://nodejs.org">Node.js</a>.</li> - <li><a href="http://socketcluster.io/">SocketCluster</a>: A pub/sub WebSocket framework for <a href="https://nodejs.org">Node.js</a> with a focus on scalability.</li> - <li><a class="link-https" href="https://github.com/Worlize/WebSocket-Node">WebSocket-Node</a>: A WebSocket server API implementation for <a href="https://nodejs.org">Node.js</a>.</li> - <li><a href="http://www.totaljs.com">Total.js</a>: Web application framework for <a href="https://www.nodejs.org">Node.js</a> (Example: <a href="https://github.com/totaljs/examples/tree/master/websocket">WebSocket chat</a>)</li> - <li><a href="https://www.npmjs.com/package/faye-websocket">Faye</a>: A <a href="/en-US/docs/Web/API/WebSockets_API">WebSocket</a> (two-ways connections) and <a href="/en-US/docs/Web/API/EventSource/">EventSource</a> (one-way connections) for <a href="https://nodejs.org">Node.js</a> Server and Client.</li> - <li><a href="http://signalr.net/">SignalR</a>: SignalR will use WebSockets under the covers when it's available, and gracefully fallback to other techniques and technologies when it isn't, while your application code stays the same.</li> - <li><a href="https://caddyserver.com/docs/websocket">Caddy</a>: A web server capable of proxying arbitrary commands (stdin/stdout) as a websocket.</li> - <li><a href="https://github.com/websockets/ws">ws</a>: a popular WebSocket client & server library for <a href="https://nodejs.org/">Node.js</a>.</li> - <li><a href="https://github.com/bigstepinc/jsonrpc-bidirectional">jsonrpc-bidirectional</a>: Asynchronous RPC which, on a single connection, may have functions exported on the server and, and the same time, on the client (client may call server, server may also call client).</li> - <li><a href="https://github.com/ninenines/cowboy">cowboy</a>: Cowboy is a small, fast and modern HTTP server for Erlang/OTP with WebSocket support.</li> -</ul> - -<h2 id="Related_Topics" name="Related_Topics">Related Topics</h2> - -<ul> - <li><a href="/en-US/docs/Web/Guide/AJAX">AJAX</a></li> - <li><a href="/en-US/docs/Web/JavaScript">JavaScript</a></li> -</ul> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comments</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("HTML WHATWG", "web-sockets.html", "WebSocket API")}}</td> - <td>{{Spec2("HTML WHATWG")}}</td> - <td></td> - </tr> - <tr> - <td><a href="https://www.w3.org/TR/websockets/">WebSockets</a></td> - <td><span class="spec-CR">Candidate Recommendation</span></td> - <td></td> - </tr> - <tr> - <td>{{RFC(6455, "The WebSocket Protocol")}}</td> - <td><span class="spec-RFC">IETF RFC</span></td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - - - -<p>{{Compat("api.WebSocket")}}</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a class="external" href="http://tools.ietf.org/html/rfc6455">RFC 6455 — The WebSocket Protocol</a></li> - <li><a class="external" href="https://www.w3.org/TR/websockets/">WebSocket API Specification</a></li> - <li><a href="/en-US/docs/Server-sent_events">Server-Sent Events</a></li> -</ul> diff --git a/files/th/web/api/window/index.html b/files/th/web/api/window/index.html deleted file mode 100644 index 9b84908ede..0000000000 --- a/files/th/web/api/window/index.html +++ /dev/null @@ -1,689 +0,0 @@ ---- -title: Window -slug: Web/API/Window -translation_of: Web/API/Window ---- -<div><font><font>{{APIRef ("DOM")}}</font></font></div> - -<p><span class="seoSummary"><strong><code>Window</code></strong><font><font>อินเตอร์เฟซที่แสดงให้เห็นถึงหน้าต่างที่มี {{คำศัพท์ ( "DOM")}} เอกสาร; </font></font><code>document</code><font><font>จุดสถานที่ให้บริการไปยัง</font></font><a href="/en-US/docs/Web/API/Document"><font><font>เอกสาร DOM</font></font></a><font><font>โหลดในหน้าต่างที่ </font></font></span><font><font>สามารถรับหน้าต่างสำหรับเอกสารที่ระบุได้โดยใช้คุณสมบัติ {{domxref ("document.defaultView")}}</font></font></p> - -<p><font><font>ตัวแปรส่วนกลาง</font></font><code>window</code><font><font>ซึ่งเป็นตัวแทนของหน้าต่างที่สคริปต์กำลังทำงานอยู่นั้นสัมผัสกับโค้ด JavaScript</font></font></p> - -<p><code>Window</code><font><font>อินเตอร์เฟซที่เป็นบ้านที่มีความหลากหลายของฟังก์ชั่น namespaces วัตถุและการก่อสร้างที่ไม่จำเป็นต้องเกี่ยวข้องโดยตรงกับแนวคิดของหน้าต่างอินเตอร์เฟซผู้ใช้ </font><font>อย่างไรก็ตาม</font></font><code>Window</code><font><font>อินเทอร์เฟซเป็นสถานที่ที่เหมาะสมในการรวมรายการเหล่านี้ที่จำเป็นต้องพร้อมใช้งานทั่วโลก </font><font>หลายคนเหล่านี้จะถูกบันทึกไว้ใน</font></font><a href="/en-US/docs/Web/JavaScript/Reference"><font><font>เอกสารอ้างอิง JavaScript</font></font></a><font><font>และ</font></font><a href="/en-US/docs/Web/API/Document_Object_Model"><font><font>DOM </font></font></a><font><font>อ้างอิง</font></font></p> - -<p><font><font>ในเบราว์เซอร์แบบแท็บแต่ละแท็บจะแสดงด้วย</font></font><code>Window</code><font><font>วัตถุ</font><font>ของตัวเอง </font><font>ทั่วโลกที่</font></font><code>window</code><font><font>เห็นโดยโค้ด JavaScript ที่ทำงานภายในแท็บหนึ่ง ๆ จะแสดงถึงแท็บที่โค้ดกำลังทำงานอยู่เสมอ </font><font>อย่างไรก็ตามในเบราว์เซอร์แบบแท็บคุณสมบัติและวิธีการบางอย่างยังคงใช้กับหน้าต่างโดยรวมที่มีแท็บเช่น {{Domxref ("Window.resizeTo", "resizeTo ()")}} และ {{Domxref (" Window.innerHeight "," innerHeight ")}} </font><font>โดยทั่วไปสิ่งที่ไม่สามารถเกี่ยวข้องกับแท็บจะเกี่ยวข้องกับหน้าต่างแทน</font></font></p> - -<p><font><font>{{InheritanceDiagram}}</font></font></p> - -<h2 id="ตัวสร้าง"><font><font>ตัวสร้าง</font></font></h2> - -<p><font><font>ดู</font></font><a href="/en-US/docs/DOM/DOM_Reference" title="/ en-US / docs / DOM / DOM_Reference"><font><font>อินเทอร์เฟซ DOM</font></font></a><font><font>ด้วย</font></font></p> - -<dl> - <dt><font><font>{{domxref ("DOMParser")}}</font></font></dt> - <dd><code>DOMParser</code><font><font>สามารถแยก XML หรือแหล่งที่มาของ HTML เก็บไว้ในสตริงเป็น DOM </font><font>เอกสาร</font></font><a href="/en-US/docs/DOM/document" title="เอกสาร"><font><font> </font></font></a><code>DOMParser</code><font><font>ที่ระบุไว้ใน</font></font><a href="https://w3c.github.io/DOM-Parsing/" title="http://html5.org/specs/dom-parsing.html"><font><font>DOM </font></font></a><font><font>แยกและเป็นอันดับ</font></font></dd> - <dt><font><font>{{domxref ("รูปภาพ")}}</font></font></dt> - <dd><font><font>ใช้สำหรับสร้าง {{domxref ("HTMLImageElement")}}</font></font></dd> - <dt><font><font>{{domxref ("ตัวเลือก")}}</font></font></dt> - <dd><font><font>ใช้สำหรับสร้าง {{domxref ("HTMLOptionElement")}}</font></font></dd> - <dt><font><font>{{domxref ("StaticRange")}} {{trial_inline}} {{readonlyinline}}</font></font></dt> - <dd><font><font>ส่งกลับคอนสตรัคเตอร์ {{domxref ('StaticRange.StaticRange', 'StaticRange ()')}} ซึ่งสร้างอ็อบเจกต์ {{domxref ('StaticRange')}}</font></font></dd> - <dt><font><font>{{domxref ("คนงาน")}}</font></font></dt> - <dd><font><font>ใช้สำหรับสร้าง</font></font><a href="/en-US/docs/DOM/Using_web_workers"><font><font>Web Worker</font></font></a></dd> - <dt><font><font>{{domxref ("XMLSerializer")}}</font></font></dt> - <dd><font><font>แปลงแผนผัง DOM เป็นซอร์ส XML หรือ HTML</font></font></dd> -</dl> - -<h2 id="คุณสมบัติ"><font><font>คุณสมบัติ</font></font></h2> - -<p><em><font><font>อินเทอร์เฟซนี้สืบทอดคุณสมบัติจากอินเทอร์เฟซ {{domxref ("EventTarget")}} และใช้คุณสมบัติจากมิกซ์อิน {{domxref ("WindowOrWorkerGlobalScope")}} และ {{domxref ("WindowEventHandlers")}}</font></font></em></p> - -<p><font><font>โปรดสังเกตว่าคุณสมบัติที่เป็นอ็อบเจกต์ (เช่นสำหรับการลบล้างต้นแบบของอิลิเมนต์ในตัว) จะแสดงรายการไว้ในส่วนแยกต่างหากด้านล่าง</font></font></p> - -<dl> - <dt><font><font>{{domxref ("Window.closed")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>คุณสมบัตินี้ระบุว่าหน้าต่างปัจจุบันปิดอยู่หรือไม่</font></font></dd> - <dt><font><font>{{domxref ("Window.console")}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังออบเจ็กต์คอนโซลที่ให้การเข้าถึงคอนโซลการดีบักของเบราว์เซอร์</font></font></dd> - <dt><font><font>{{domxref ("Window.controllers")}} {{ReadOnlyInline}} {{non-standard_inline}}</font></font></dt> - <dd><font><font>ส่งคืนอ็อบเจ็กต์คอนโทรลเลอร์ XUL สำหรับหน้าต่างโครเมี่ยมปัจจุบัน</font></font></dd> - <dt><font><font>{{domxref ("Window.customElements")}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งกลับการอ้างอิงถึงออบเจ็กต์ {{domxref ("CustomElementRegistry")}} ซึ่งสามารถใช้เพื่อลงทะเบียน</font></font><a href="/en-US/docs/Web/Web_Components/Using_custom_elements"><font><font>องค์ประกอบที่กำหนดเอง</font></font></a><font><font>ใหม่</font><font>และรับข้อมูลเกี่ยวกับองค์ประกอบที่กำหนดเองที่ลงทะเบียนไว้ก่อนหน้านี้</font></font></dd> - <dt><font><font>{{domxref ("Window.crypto")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนวัตถุการเข้ารหัสลับของเบราว์เซอร์</font></font></dd> - <dt><font><font>{{domxref ("Window.devicePixelRatio")}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งกลับอัตราส่วนระหว่างพิกเซลจริงและพิกเซลอิสระของอุปกรณ์ในจอแสดงผลปัจจุบัน</font></font></dd> - <dt><font><font>{{domxref ("Window.document")}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังเอกสารที่มีหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.DOMMatrix")}} {{readOnlyInline}} {{trial_inline}}</font></font></dt> - <dd><font><font>ส่งกลับการอ้างอิงถึงออบเจ็กต์ {{domxref ("DOMMatrix")}} ซึ่งแสดงถึงเมทริกซ์ 4x4 เหมาะสำหรับการดำเนินการ 2 มิติและ 3 มิติ</font></font></dd> - <dt><font><font>{{domxref ("Window.DOMMatrixReadOnly")}} {{readOnlyInline}} {{trial_inline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังออบเจ็กต์ {{domxref ("DOMMatrixReadOnly")}} ซึ่งแสดงถึงเมทริกซ์ 4x4 เหมาะสำหรับการดำเนินการ 2 มิติและ 3 มิติ</font></font></dd> - <dt><font><font>{{domxref ("Window.DOMPoint")}} {{readOnlyInline}} {{trial_inline}}</font></font></dt> - <dd><font><font>ส่งกลับการอ้างอิงไปยังออบเจ็กต์ {{domxref ("DOMPoint")}} ซึ่งแสดงถึงจุด 2 มิติหรือ 3 มิติในระบบพิกัด</font></font></dd> - <dt><font><font>{{domxref ("Window.DOMPointReadOnly")}} {{readOnlyInline}} {{trial_inline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังออบเจ็กต์ {{domxref ("DOMPointReadOnly")}} ซึ่งแสดงถึงจุด 2 มิติหรือ 3 มิติในระบบพิกัด</font></font></dd> - <dt><font><font>{{domxref ("Window.DOMQuad")}} {{readOnlyInline}} {{trial_inline}}</font></font></dt> - <dd><font><font>ส่งกลับการอ้างอิงถึงออบเจ็กต์ {{domxref ("DOMQuad")}} ซึ่งแสดงถึงออบเจ็กต์รูปสี่เหลี่ยมจัตุรัสนั่นคืออันที่มีสี่มุมและสี่ด้าน</font></font></dd> - <dt><font><font>{{domxref ("Window.DOMRect")}} {{readOnlyInline}} {{trial_inline}}</font></font></dt> - <dd><font><font>ส่งกลับการอ้างอิงไปยังออบเจ็กต์ {{domxref ("DOMRect")}} ซึ่งแสดงถึงสี่เหลี่ยมผืนผ้า</font></font></dd> - <dt><font><font>{{domxref ("Window.DOMRectReadOnly")}} {{readOnlyInline}} {{trial_inline}}</font></font></dt> - <dd><font><font>ส่งกลับการอ้างอิงไปยังวัตถุ {{domxref ("DOMRectReadOnly")}} ซึ่งแสดงถึงรูปสี่เหลี่ยมผืนผ้า</font></font></dd> - <dt><font><font>{{domxref ("Window.event")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืน</font></font><strong><font><font>เหตุการณ์ปัจจุบัน</font></font></strong><font><font>ซึ่งเป็นเหตุการณ์ที่กำลังจัดการโดยบริบทของโค้ด JavaScript หรือ</font></font><code>undefined</code><font><font>หากไม่มีเหตุการณ์ใดที่กำลังจัดการอยู่ </font><font>ควรใช้ออบเจ็กต์ {{domxref ("Event")}} ที่ส่งตรงไปยังตัวจัดการเหตุการณ์แทนทุกครั้งที่ทำได้</font></font></dd> - <dt><font><font>{{domxref ("Window.frameElement")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนองค์ประกอบที่ฝังหน้าต่างหรือเป็นโมฆะหากไม่ได้ฝังหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.frames")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนอาร์เรย์ของเฟรมย่อยในหน้าต่างปัจจุบัน</font></font></dd> - <dt><font><font>{{domxref ("Window.fullScreen")}}</font></font></dt> - <dd><font><font>คุณสมบัตินี้ระบุว่าหน้าต่างแสดงแบบเต็มหน้าจอหรือไม่</font></font></dd> - <dt><font><font>{{domxref ("Window.history")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังออบเจ็กต์ประวัติ</font></font></dd> - <dt><font><font>{{domxref ("Window.innerHeight")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>รับความสูงของพื้นที่เนื้อหาของหน้าต่างเบราว์เซอร์รวมถึงแถบเลื่อนแนวนอนหากแสดงผล</font></font></dd> - <dt><font><font>{{domxref ("Window.innerWidth")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>รับความกว้างของพื้นที่เนื้อหาของหน้าต่างเบราว์เซอร์รวมถึงแถบเลื่อนแนวตั้งหากแสดงผล</font></font></dd> - <dt><font><font>{{domxref ("Window.isSecureContext")}} {{trial_inline}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ระบุว่าบริบทสามารถใช้คุณลักษณะที่ต้องการบริบทที่ปลอดภัยได้หรือไม่</font></font></dd> - <dt><font><font>{{domxref ("Window.length")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนจำนวนเฟรมในหน้าต่าง </font><font>โปรดดู {{domxref ("window.frames")}} ด้วย</font></font></dd> - <dt><font><font>{{domxref ("Window.location")}}</font></font></dt> - <dd><font><font>รับ / ตั้งค่าตำแหน่งหรือ URL ปัจจุบันของวัตถุหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.locationbar")}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนวัตถุแถบตำแหน่งซึ่งสามารถสลับการเปิดเผยในหน้าต่างได้</font></font></dd> - <dt><font><font>{{domxref ("Window.localStorage")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังออบเจ็กต์หน่วยเก็บข้อมูลในเครื่องที่ใช้ในการจัดเก็บข้อมูลที่สามารถเข้าถึงได้โดยต้นทางที่สร้างขึ้นเท่านั้น</font></font></dd> - <dt><font><font>{{domxref ("Window.menubar")}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนวัตถุแถบเมนูซึ่งสามารถสลับการมองเห็นได้ในหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.messageManager")}} {{non-standard_inline}}</font></font></dt> - <dd><font><font>ส่งคืน</font><font>วัตถุ</font></font><a href="/en-US/docs/The_message_manager"><font><font>ตัวจัดการข้อความ</font></font></a><font><font>สำหรับหน้าต่างนี้</font></font></dd> - <dt><font><font>{{domxref ("Window.mozInnerScreenX")}} {{ReadOnlyInline}} {{non-standard_inline}}</font></font></dt> - <dd><font><font>ส่งกลับพิกัดแนวนอน (X) ของมุมบนซ้ายของวิวพอร์ตของหน้าต่างในพิกัดหน้าจอ </font><font>ค่านี้รายงานเป็นพิกเซล CSS </font><font>ดู</font></font><code>mozScreenPixelsPerCSSPixel</code><font><font>ใน {{interface ("nsIDOMWindowUtils")}} สำหรับปัจจัยการแปลงเพื่อปรับให้เข้ากับพิกเซลของหน้าจอหากจำเป็น</font></font></dd> - <dt><font><font>{{domxref ("Window.mozInnerScreenY")}} {{ReadOnlyInline}} {{non-standard_inline}}</font></font></dt> - <dd><font><font>ส่งกลับพิกัดแนวตั้ง (Y) ของมุมบนซ้ายของวิวพอร์ตของหน้าต่างในพิกัดหน้าจอ </font><font>ค่านี้รายงานเป็นพิกเซล CSS </font><font>ดู</font></font><code>mozScreenPixelsPerCSSPixel</code><font><font>ปัจจัยการแปลงเพื่อปรับให้เข้ากับพิกเซลหน้าจอหากจำเป็น</font></font></dd> - <dt><font><font>{{domxref ("Window.name")}}</font></font></dt> - <dd><font><font>รับ / ตั้งชื่อของหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.navigator")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังวัตถุเนวิเกเตอร์</font></font></dd> - <dt><font><font>{{domxref ("Window.opener")}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังหน้าต่างที่เปิดหน้าต่างปัจจุบันนี้</font></font></dd> - <dt><font><font>{{domxref ("Window.outerHeight")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>รับความสูงของด้านนอกของหน้าต่างเบราว์เซอร์</font></font></dd> - <dt><font><font>{{domxref ("Window.outerWidth")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>รับความกว้างของด้านนอกของหน้าต่างเบราว์เซอร์</font></font></dd> - <dt><font><font>{{domxref ("Window.scrollX", "Window.pageXOffset")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>นามแฝงสำหรับ {{domxref ("window.scrollX")}}</font></font></dd> - <dt><font><font>{{domxref ("Window.scrollY", "Window.pageYOffset")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>นามแฝงสำหรับ {{domxref ("window.scrollY")}}</font></font></dd> - <dt><font><font>{{domxref ("Window.parent")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงถึงพาเรนต์ของหน้าต่างหรือเฟรมย่อยปัจจุบัน</font></font></dd> - <dt><font><font>{{domxref ("Window.performance")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนอ็อบเจ็กต์ {{domxref ("Performance")}} ซึ่งรวมถึง {{domxref ("Performance.timing", "timing")}} และ {{domxref ("Performance.navigation", "navigation")}} แอตทริบิวต์ซึ่งแต่ละรายการเป็นวัตถุที่ให้</font><font>ข้อมูล</font></font><a href="/en-US/docs/Navigation_timing"><font><font>ที่เกี่ยวข้องกับ</font></font></a><font><font>ประสิทธิภาพ </font><font>โปรดดู</font></font><a href="/en-US/docs/Web/API/Navigation_timing_API/Using_Navigation_Timing"><font><font>การใช้ Navigation Timing</font></font></a><font><font>สำหรับข้อมูลเพิ่มเติมและตัวอย่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.personalbar")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนวัตถุ Personalbar ซึ่งสามารถสลับการมองเห็นได้ในหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.screen")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังออบเจ็กต์หน้าจอที่เกี่ยวข้องกับหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.screenX")}} และ {{domxref ("Window.screenLeft")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>คุณสมบัติทั้งสองจะคืนระยะทางแนวนอนจากขอบด้านซ้ายของวิวพอร์ตของเบราว์เซอร์ของผู้ใช้ไปทางด้านซ้ายของหน้าจอ</font></font></dd> - <dt><font><font>{{domxref ("Window.screenY")}} และ {{domxref ("Window.screenTop")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>คุณสมบัติทั้งสองจะคืนระยะทางแนวตั้งจากเส้นขอบด้านบนของวิวพอร์ตเบราว์เซอร์ของผู้ใช้ไปที่ด้านบนของหน้าจอ</font></font></dd> - <dt><font><font>{{domxref ("Window.scrollbars")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนอ็อบเจ็กต์แถบเลื่อนซึ่งสามารถสลับการมองเห็นได้ในหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.scrollMaxX")}} {{non-standard_inline}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ค่าชดเชยสูงสุดที่สามารถเลื่อนหน้าต่างไปเป็นแนวนอนได้นั่นคือความกว้างของเอกสารลบด้วยความกว้างของวิวพอร์ต</font></font></dd> - <dt><font><font>{{domxref ("Window.scrollMaxY")}} {{non-standard_inline}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ค่าชดเชยสูงสุดที่สามารถเลื่อนหน้าต่างไปยังแนวตั้งได้ (เช่นความสูงของเอกสารลบด้วยความสูงของวิวพอร์ต)</font></font></dd> - <dt><font><font>{{domxref ("Window.scrollX")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนจำนวนพิกเซลที่เอกสารถูกเลื่อนไปแล้วในแนวนอน</font></font></dd> - <dt><font><font>{{domxref ("Window.scrollY")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนจำนวนพิกเซลที่เอกสารถูกเลื่อนในแนวตั้งแล้ว</font></font></dd> - <dt><font><font>{{domxref ("Window.self")}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงอ็อบเจ็กต์ไปยังอ็อบเจ็กต์หน้าต่างเอง</font></font></dd> - <dt><font><font>{{domxref ("Window.sessionStorage")}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังออบเจ็กต์หน่วยเก็บข้อมูลเซสชันที่ใช้ในการจัดเก็บข้อมูลที่สามารถเข้าถึงได้โดยต้นทางที่สร้าง</font></font></dd> - <dt><font><font>{{domxref ("Window.sidebar")}} {{non-standard_inline}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังวัตถุหน้าต่างของแถบด้านข้าง</font></font></dd> - <dt><font><font>{{domxref ("Window.speechSynthesis")}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนออบเจ็กต์ {{domxref ("SpeechSynthesis")}} ซึ่งเป็นจุดเริ่มต้นในการใช้</font><font>ฟังก์ชันการสังเคราะห์</font></font><a href="/en-US/docs/Web/API/Web_Speech_API"><font><font>เสียงพูด Web Speech API</font></font></a></dd> - <dt><font><font>{{domxref ("Window.status")}}</font></font></dt> - <dd><font><font>รับ / ตั้งค่าข้อความในแถบสถานะที่ด้านล่างของเบราว์เซอร์</font></font></dd> - <dt><font><font>{{domxref ("Window.statusbar")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนออบเจ็กต์แถบสถานะซึ่งสามารถสลับการเปิดเผยได้ในหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.toolbar")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนอ็อบเจ็กต์แถบเครื่องมือซึ่งสามารถสลับการเปิดเผยได้ในหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.top")}} {{readOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังหน้าต่างที่อยู่บนสุดในลำดับชั้นของหน้าต่าง </font><font>คุณสมบัตินี้เป็นแบบอ่านอย่างเดียว</font></font></dd> - <dt><font><font>{{domxref ("Window.visualViewport")}} {{readOnlyInline}} {{trial_inline}}</font></font></dt> - <dd><font><font>ส่งคืนออบเจ็กต์ {{domxref ("VisualViewport")}} ซึ่งแสดงถึงวิวพอร์ตภาพสำหรับหน้าต่างที่กำหนด</font></font></dd> - <dt><font><font>{{domxref ("Window.window")}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยังหน้าต่างปัจจุบัน</font></font></dd> - <dt><code>window[0]</code><font><font>, </font></font><code>window[1]</code><font><font>ฯลฯ</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงไปยัง</font></font><code>window</code><font><font>วัตถุในเฟรม </font><font>ดูรายละเอียดเพิ่มเติมที่ {{domxref ("Window.frames")}}</font></font></dd> -</dl> - -<h3 id="คุณสมบัติดำเนินการจากที่อื่น"><font><font>คุณสมบัติดำเนินการจากที่อื่น</font></font></h3> - -<dl> - <dt><font><font>{{domxref ("WindowOrWorkerGlobalScope.caches")}} {{readOnlyinline}}</font></font></dt> - <dd><font><font>ส่งคืนอ็อบเจ็กต์ {{domxref ("CacheStorage")}} ที่เชื่อมโยงกับบริบทปัจจุบัน </font><font>อ็อบเจ็กต์นี้เปิดใช้งานฟังก์ชันต่างๆเช่นการจัดเก็บเนื้อหาสำหรับการใช้งานออฟไลน์และสร้างการตอบสนองที่กำหนดเองสำหรับคำขอ</font></font></dd> - <dt><font><font>{{domxref ("WindowOrWorkerGlobalScope.indexedDB")}} {{readonlyInline}}</font></font></dt> - <dd><font><font>จัดเตรียมกลไกสำหรับแอปพลิเคชันเพื่อเข้าถึงความสามารถของฐานข้อมูลที่ทำดัชนีแบบอะซิงโครนัส </font><font>ส่งคืนอ็อบเจ็กต์ {{domxref ("IDBFactory")}}</font></font></dd> - <dt><font><font>{{domxref ("WindowOrWorkerGlobalScope.isSecureContext")}} {{readOnlyinline}}</font></font></dt> - <dd><font><font>ส่งคืนบูลีนที่ระบุว่าบริบทปัจจุบันปลอดภัย ( </font></font><code>true</code><font><font>) หรือไม่ ( </font></font><code>false</code><font><font>)</font></font></dd> - <dt><font><font>{{domxref ("WindowOrWorkerGlobalScope.origin")}} {{readOnlyinline}}</font></font></dt> - <dd><font><font>ส่งคืนจุดเริ่มต้นของวัตถุส่วนกลางโดยจัดลำดับเป็นสตริง </font><font>(สิ่งนี้ยังไม่ปรากฏในเบราว์เซอร์ใด ๆ )</font></font></dd> -</dl> - -<h3 id="คุณสมบัติที่ไม่รองรับ"><font><font>คุณสมบัติที่ไม่รองรับ</font></font></h3> - -<dl> - <dt><font><font>{{domxref ("Window.content")}} และ</font></font><code>Window._content</code><font><font>{{Non-standard_inline}} {{deprecated_inline}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>ส่งคืนการอ้างอิงถึงองค์ประกอบเนื้อหาในหน้าต่างปัจจุบัน </font><font>ตั้งแต่ Firefox 57 (เริ่มต้นใช้งานเฉพาะคืนเท่านั้น) ทั้งสองเวอร์ชันมีให้ใช้งานจากรหัสโครเมี่ยม (สิทธิพิเศษ) เท่านั้นและไม่สามารถใช้งานบนเว็บได้อีกต่อไป</font></font></dd> - <dt><font><font>{{domxref ("Window.defaultStatus")}} {{deprecated_inline}}</font></font></dt> - <dd><font><font>รับ / ตั้งค่าข้อความแถบสถานะสำหรับหน้าต่างที่กำหนด</font></font></dd> - <dt><font><font>{{domxref ("Window.dialogArguments")}} {{deprecated_inline}} {{ReadOnlyInline}}</font></font></dt> - <dd><font><font>รับอาร์กิวเมนต์ที่ส่งผ่านไปยังหน้าต่าง (หากเป็นกล่องโต้ตอบ) เมื่อมีการเรียก {{domxref ("window.showModalDialog ()")}} </font><font>นี่คือ {{Interface ("nsIArray")}}</font></font></dd> - <dt><font><font>{{domxref ("Window.directories")}} {{deprecated_inline}}</font></font></dt> - <dd><font><font>คำพ้องความหมายของ {{domxref ("window.personalbar")}}</font></font></dd> - <dt><font><font>{{domxref ("Window.globalStorage")}} {{Non-standard_inline}} {{deprecated_inline}}</font></font></dt> - <dd><font><font>อ็อบเจ็กต์หน่วยเก็บข้อมูลจำนวนมากที่ใช้สำหรับจัดเก็บข้อมูลในหลายเพจ</font></font></dd> - <dt><font><font>{{domxref ("Window.mozAnimationStartTime")}} {{Non-standard_inline}} {{deprecated_inline}}</font></font></dt> - <dd><font><font>เวลาในหน่วยมิลลิวินาทีนับตั้งแต่ยุคที่วงจรการเคลื่อนไหวปัจจุบันเริ่มต้นขึ้น </font><font>ใช้ {{domxref ("Animation.startTime")}} แทน</font></font></dd> - <dt><font><font>{{domxref ("Window.mozPaintCount")}} {{non-standard_inline}} {{deprecated_inline}}</font></font></dt> - <dd><font><font>ส่งคืนจำนวนครั้งที่เอกสารปัจจุบันถูกแสดงบนหน้าจอในหน้าต่างนี้ </font><font>สามารถใช้เพื่อคำนวณประสิทธิภาพการแสดงผล</font></font></dd> - <dt><font><font>{{domxref ("Window.orientation")}} {{readOnlyInline}} {{deprecated_inline}}</font></font></dt> - <dd><font><font>ส่งคืนการวางแนวเป็นองศา (เพิ่มขึ้นทีละ 90 องศา) ของวิวพอร์ตที่สัมพันธ์กับการวางแนวตามธรรมชาติของอุปกรณ์</font></font></dd> - <dt><font><font>{{domxref ("Window.pkcs11")}} {{deprecated_inline}}</font></font></dt> - <dd><font><font>เดิมให้การเข้าถึงเพื่อติดตั้งและลบโมดูล PKCS11</font></font></dd> - <dt><font><font>{{domxref ("Window.returnValue")}} {{deprecated_inline}}</font></font></dt> - <dd><font><font>ค่าส่งคืนที่จะส่งกลับไปยังฟังก์ชันที่เรียกว่า {{domxref ("window.showModalDialog ()")}} เพื่อแสดงหน้าต่างเป็นกล่องโต้ตอบโมดอล</font></font></dd> -</dl> - -<h2 id="วิธีการ"><font><font>วิธีการ</font></font></h2> - -<p><em><font><font>อินเทอร์เฟซนี้สืบทอดเมธอดจากอินเทอร์เฟซ {{domxref ("EventTarget")}} และใช้เมธอดจาก {{domxref ("WindowOrWorkerGlobalScope")}} และ {{domxref ("EventTarget")}}</font></font></em></p> - -<dl> - <dt><font><font>{{domxref ("Window.alert ()")}}</font></font></dt> - <dd><font><font>แสดงกล่องโต้ตอบการแจ้งเตือน</font></font></dd> - <dt><font><font>{{domxref ("Window.blur ()")}}</font></font></dt> - <dd><font><font>ตั้งโฟกัสให้ห่างจากหน้าต่าง</font></font></dd> - <dt><font><font>{{domxref ("Window.cancelAnimationFrame ()")}} {{trial_inline}}</font></font></dt> - <dd><font><font>ช่วยให้คุณสามารถยกเลิกการโทรกลับที่กำหนดไว้ก่อนหน้านี้ด้วย {{domxref ("Window.requestAnimationFrame")}}</font></font></dd> - <dt>{{domxref("Window.cancelIdleCallback()")}} {{experimental_inline}}</dt> - <dd>Enables you to cancel a callback previously scheduled with {{domxref("Window.requestIdleCallback")}}.</dd> - <dt>{{domxref("Window.clearImmediate()")}}</dt> - <dd>Cancels the repeated execution set using <code>setImmediate</code>.</dd> - <dt>{{domxref("Window.close()")}}</dt> - <dd>Closes the current window.</dd> - <dt>{{domxref("Window.confirm()")}}</dt> - <dd>Displays a dialog with a message that the user needs to respond to.</dd> - <dt>{{domxref("Window.dump()")}} {{Non-standard_inline}}</dt> - <dd>Writes a message to the console.</dd> - <dt>{{domxref("Window.find()")}}</dt> - <dd>Searches for a given string in a window.</dd> - <dt>{{domxref("Window.focus()")}}</dt> - <dd>Sets focus on the current window.</dd> - <dt>{{domxref("Window.getComputedStyle()")}}</dt> - <dd>Gets computed style for the specified element. Computed style indicates the computed values of all CSS properties of the element.</dd> - <dt>{{domxref("Window.getDefaultComputedStyle()")}} {{Non-standard_inline}}</dt> - <dd>Gets default computed style for the specified element, ignoring author stylesheets.</dd> - <dt>{{domxref("Window.getSelection()")}}</dt> - <dd>Returns the selection object representing the selected item(s).</dd> - <dt>{{domxref("Window.matchMedia()")}}</dt> - <dd>Returns a {{domxref("MediaQueryList")}} object representing the specified media query string.</dd> - <dt>{{domxref("Window.maximize()")}}</dt> - <dd>{{todo("NeedsContents")}}</dd> - <dt>{{domxref("Window.minimize()")}} (top-level XUL windows only)</dt> - <dd>Minimizes the window.</dd> - <dt>{{domxref("Window.moveBy()")}}</dt> - <dd>Moves the current window by a specified amount.</dd> - <dt>{{domxref("Window.moveTo()")}}</dt> - <dd>Moves the window to the specified coordinates.</dd> - <dt>{{domxref("Window.open()")}}</dt> - <dd>Opens a new window.</dd> - <dt>{{domxref("Window.postMessage()")}}</dt> - <dd>Provides a secure means for one window to send a string of data to another window, which need not be within the same domain as the first.</dd> - <dt>{{domxref("Window.print()")}}</dt> - <dd>Opens the Print Dialog to print the current document.</dd> - <dt>{{domxref("Window.prompt()")}}</dt> - <dd>Returns the text entered by the user in a prompt dialog.</dd> - <dt>{{domxref("Window.requestAnimationFrame()")}}</dt> - <dd>Tells the browser that an animation is in progress, requesting that the browser schedule a repaint of the window for the next animation frame.</dd> - <dt>{{domxref("Window.requestIdleCallback()")}} {{experimental_inline}}</dt> - <dd>Enables the scheduling of tasks during a browser's idle periods.</dd> - <dt>{{domxref("Window.resizeBy()")}}</dt> - <dd>Resizes the current window by a certain amount.</dd> - <dt>{{domxref("Window.resizeTo()")}}</dt> - <dd>Dynamically resizes window.</dd> - <dt>{{domxref("Window.scroll()")}}</dt> - <dd>Scrolls the window to a particular place in the document.</dd> - <dt>{{domxref("Window.scrollBy()")}}</dt> - <dd>Scrolls the document in the window by the given amount.</dd> - <dt>{{domxref("Window.scrollByLines()")}} {{Non-standard_inline}}</dt> - <dd>Scrolls the document by the given number of lines.</dd> - <dt>{{domxref("Window.scrollByPages()")}} {{Non-standard_inline}}</dt> - <dd>Scrolls the current document by the specified number of pages.</dd> - <dt>{{domxref("Window.scrollTo()")}}</dt> - <dd>Scrolls to a particular set of coordinates in the document.</dd> - <dt>{{domxref("Window.setImmediate()")}}</dt> - <dd>Executes a function after the browser has finished other heavy tasks</dd> - <dt>{{domxref("Window.setResizable()")}} {{Non-standard_inline}}</dt> - <dd>Toggles a user's ability to resize a window.</dd> - <dt>{{domxref("Window.sizeToContent()")}} {{Non-standard_inline}}</dt> - <dd>Sizes the window according to its content.</dd> - <dt>{{domxref("Window.stop()")}}</dt> - <dd>This method stops window loading.</dd> - <dt>{{domxref("Window.updateCommands()")}} {{Non-standard_inline}}</dt> - <dd>Updates the state of commands of the current chrome window (UI).</dd> -</dl> - -<h3 id="Methods_implemented_from_elsewhere">Methods implemented from elsewhere</h3> - -<dl> - <dt>{{domxref("EventTarget.addEventListener()")}}</dt> - <dd>Register an event handler to a specific event type on the window.</dd> - <dt>{{domxref("EventTarget.dispatchEvent()")}}</dt> - <dd>Used to trigger an event.</dd> - <dt>{{domxref("WindowOrWorkerGlobalScope.atob()")}}</dt> - <dd>Decodes a string of data which has been encoded using base-64 encoding.</dd> - <dt>{{domxref("WindowOrWorkerGlobalScope.btoa()")}}</dt> - <dd>Creates a base-64 encoded ASCII string from a string of binary data.</dd> - <dt>{{domxref("WindowOrWorkerGlobalScope.clearInterval()")}}</dt> - <dd>Cancels the repeated execution set using {{domxref("WindowOrWorkerGlobalScope.setInterval()")}}.</dd> - <dt>{{domxref("WindowOrWorkerGlobalScope.clearTimeout()")}}</dt> - <dd>Cancels the delayed execution set using {{domxref("WindowOrWorkerGlobalScope.setTimeout()")}}.</dd> - <dt>{{domxref("WindowOrWorkerGlobalScope.createImageBitmap()")}}</dt> - <dd>Accepts a variety of different image sources, and returns a {{domxref("Promise")}} which resolves to an {{domxref("ImageBitmap")}}. Optionally the source is cropped to the rectangle of pixels originating at <em>(sx, sy)</em> with width sw, and height sh.</dd> - <dt>{{domxref("WindowOrWorkerGlobalScope.fetch()")}}</dt> - <dd>Starts the process of fetching a resource from the network.</dd> - <dt>{{domxref("EventTarget.removeEventListener")}}</dt> - <dd>Removes an event listener from the window.</dd> - <dt>{{domxref("WindowOrWorkerGlobalScope.setInterval()")}}</dt> - <dd>Schedules a function to execute every time a given number of milliseconds elapses.</dd> - <dt>{{domxref("WindowOrWorkerGlobalScope.setTimeout()")}}</dt> - <dd>Schedules a function to execute in a given amount of time.</dd> -</dl> - -<h3 id="Deprecated_methods">Deprecated methods</h3> - -<dl> - <dt>{{domxref("Window.back()")}} {{Non-standard_inline}} {{deprecated_inline}}</dt> - <dd>Moves back one in the window history. This method is deprecated; you should instead use {{domxref("History.back", "window.history.back()")}}.</dd> - <dt>{{domxref("Window.captureEvents()")}} {{Non-standard_inline}} {{deprecated_inline}}</dt> - <dd>Registers the window to capture all events of the specified type.</dd> - <dt>{{domxref("Window.forward()")}} {{Non-standard_inline}} {{deprecated_inline}}</dt> - <dd>Moves the window one document forward in the history. This method is deprecated; you should instead use {{domxref("History.forward", "window.history.forward()")}}.</dd> - <dt>{{domxref("Window.getAttention()")}} {{Non-standard_inline}} {{deprecated_inline}}</dt> - <dd>Flashes the application icon.</dd> - <dt>{{domxref("Window.home()")}} {{Non-standard_inline}} {{deprecated_inline}}</dt> - <dd>Returns the browser to the home page.</dd> - <dt>{{domxref("Window.openDialog()")}} {{Non-standard_inline}} {{deprecated_inline}}</dt> - <dd>Opens a new dialog window.</dd> - <dt>{{domxref("Window.releaseEvents()")}} {{Non-standard_inline}} {{deprecated_inline}}</dt> - <dd>Releases the window from trapping events of a specific type.</dd> - <dt>{{domxref("Window.showModalDialog()")}} {{Non-standard_inline}} {{deprecated_inline}}</dt> - <dd>Displays a modal dialog.</dd> -</dl> - -<h2 id="Event_handlers">Event handlers</h2> - -<p>These are properties of the window object that can be set to establish event handlers for the various things that can happen in the window that might be of interest.</p> - -<p><em>This interface inherits event handlers from the {{domxref("EventTarget")}} interface and implements event handlers from {{domxref("WindowEventHandlers")}}.</em></p> - -<dl> - <dt>{{domxref("Window.onappinstalled")}}</dt> - <dd>Called when the page is installed as a webapp. See {{domxref("Window/appinstalled_event", "appinstalled")}} event.</dd> - <dt>{{domxref("Window.onbeforeinstallprompt")}}</dt> - <dd>An event handler property dispatched before a user is prompted to save a web site to a home screen on mobile.</dd> - <dt>{{domxref("Window.ondevicelight")}}</dt> - <dd>An event handler property for any ambient light levels changes</dd> - <dt>{{domxref("Window.ondevicemotion")}}</dt> - <dd>Called if accelerometer detects a change (For mobile devices)</dd> - <dt>{{domxref("Window.ondeviceorientation")}}</dt> - <dd>Called when the orientation is changed (For mobile devices)</dd> - <dt>{{domxref("Window.ondeviceorientationabsolute")}} {{non-standard_inline}}</dt> - <dd>An event handler property for any device orientation changes.</dd> - <dt>{{domxref("Window.ondeviceproximity")}}</dt> - <dd>An event handler property for device proximity event</dd> - <dt>{{domxref("Window.ongamepadconnected")}}</dt> - <dd>Represents an event handler that will run when a gamepad is connected (when the {{event('gamepadconnected')}} event fires).</dd> - <dt>{{domxref("Window.ongamepaddisconnected")}}</dt> - <dd>Represents an event handler that will run when a gamepad is disconnected (when the {{event('gamepaddisconnected')}} event fires).</dd> - <dt>{{domxref("Window.onmozbeforepaint")}}</dt> - <dd>An event handler property for the <code>MozBeforePaint</code> event, which is sent before repainting the window if the event has been requested by a call to the {{domxref("Window.mozRequestAnimationFrame()")}} method.</dd> - <dt>{{domxref("Window.onpaint")}}</dt> - <dd>An event handler property for paint events on the window.</dd> - <dt>{{domxref("Window.onrejectionhandled")}}</dt> - <dd>An event handler for handled {{jsxref("Promise")}} rejection events.</dd> - <dt>{{domxref("Window.onuserproximity")}}</dt> - <dd>An event handler property for user proximity events.</dd> - <dt>{{domxref("Window.onvrdisplayconnect")}}</dt> - <dd>Represents an event handler that will run when a compatible VR device has been connected to the computer (when the {{event("vrdisplayconnected")}} event fires).</dd> - <dt>{{domxref("Window.onvrdisplaydisconnect")}}</dt> - <dd>Represents an event handler that will run when a compatible VR device has been disconnected from the computer (when the {{event("vrdisplaydisconnected")}} event fires).</dd> - <dt>{{domxref("Window.onvrdisplayactivate")}}</dt> - <dd>Represents an event handler that will run when a display is able to be presented to (when the {{event("vrdisplayactivate")}} event fires), for example if an HMD has been moved to bring it out of standby, or woken up by being put on.</dd> - <dt>{{domxref("Window.onvrdisplaydeactivate")}}</dt> - <dd>Represents an event handler that will run when a display can no longer be presented to (when the {{event("vrdisplaydeactivate")}} event fires), for example if an HMD has gone into standby or sleep mode due to a period of inactivity.</dd> - <dt>{{domxref("Window.onvrdisplayblur")}}</dt> - <dd>Represents an event handler that will run when presentation to a display has been paused for some reason by the browser, OS, or VR hardware (when the {{event("vrdisplayblur")}} event fires) — for example, while the user is interacting with a system menu or browser, to prevent tracking or loss of experience.</dd> - <dt>{{domxref("Window.onvrdisplayfocus")}}</dt> - <dd>Represents an event handler that will run when presentation to a display has resumed after being blurred (when the {{event("vrdisplayfocus")}} event fires).</dd> - <dt>{{domxref("Window.onvrdisplaypresentchange")}}</dt> - <dd>represents an event handler that will run when the presenting state of a VR device changes — i.e. goes from presenting to not presenting, or vice versa (when the {{event("vrdisplaypresentchange")}} event fires).</dd> -</dl> - -<h3 id="Event_handlers_implemented_from_elsewhere">Event handlers implemented from elsewhere</h3> - -<dl> - <dt>{{domxref("GlobalEventHandlers.onabort")}}</dt> - <dd>Called when the loading of a resource has been aborted, such as by a user canceling the load while it is still in progress</dd> - <dt>{{domxref("WindowEventHandlers.onafterprint")}}</dt> - <dd>Called when the print dialog box is closed. See {{event("afterprint")}} event.</dd> - <dt>{{domxref("WindowEventHandlers.onbeforeprint")}}</dt> - <dd>Called when the print dialog box is opened. See {{event("beforeprint")}} event.</dd> - <dt>{{domxref("WindowEventHandlers.onbeforeunload")}}</dt> - <dd>An event handler property for before-unload events on the window.</dd> - <dt>{{domxref("GlobalEventHandlers.onblur")}}</dt> - <dd>Called after the window loses focus, such as due to a popup.</dd> - <dt>{{domxref("GlobalEventHandlers.onchange")}}</dt> - <dd>An event handler property for change events on the window.</dd> - <dt>{{domxref("GlobalEventHandlers.onclick")}}</dt> - <dd>Called after the ANY mouse button is pressed & released</dd> - <dt>{{domxref("GlobalEventHandlers.ondblclick")}}</dt> - <dd>Called when a double click is made with ANY mouse button.</dd> - <dt>{{domxref("GlobalEventHandlers.onclose")}}</dt> - <dd>Called after the window is closed</dd> - <dt>{{domxref("GlobalEventHandlers.oncontextmenu")}}</dt> - <dd>Called when the RIGHT mouse button is pressed</dd> - <dt>{{domxref("GlobalEventHandlers.onerror")}}</dt> - <dd>Called when a resource fails to load OR when an error occurs at runtime. See {{event("error")}} event.</dd> - <dt>{{domxref("GlobalEventHandlers.onfocus")}}</dt> - <dd>Called after the window receives or regains focus. See {{event("focus")}} events.</dd> - <dt>{{domxref("WindowEventHandlers.onhashchange")}}</dt> - <dd>An event handler property for {{event('hashchange')}} events on the window; called when the part of the URL after the hash mark ("#") changes.</dd> - <dt>{{domxref("GlobalEventHandlers.oninput")}}</dt> - <dd>Called when the value of an <input> element changes</dd> - <dt>{{domxref("GlobalEventHandlers.onkeydown")}}</dt> - <dd>Called when you begin pressing ANY key. See {{event("keydown")}} event.</dd> - <dt>{{domxref("GlobalEventHandlers.onkeypress")}}</dt> - <dd>Called when a key (except Shift, Fn, and CapsLock) is in pressed position. See {{event("keypress")}} event.</dd> - <dt>{{domxref("GlobalEventHandlers.onkeyup")}}</dt> - <dd>Called when you finish releasing ANY key. See {{event("keyup")}} event.</dd> - <dt>{{domxref("WindowEventHandlers.onlanguagechange")}}</dt> - <dd>An event handler property for {{event("languagechange")}} events on the window.</dd> - <dt>{{domxref("GlobalEventHandlers.onload")}}</dt> - <dd>Called after all resources and the DOM are fully loaded. WILL NOT get called when the page is loaded from cache, such as with back button.</dd> - <dt>{{domxref("WindowEventHandlers.onmessage")}}</dt> - <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("message")}} event is raised.</dd> - <dt>{{domxref("GlobalEventHandlers.onmousedown")}}</dt> - <dd>Called when ANY mouse button is pressed.</dd> - <dt>{{domxref("GlobalEventHandlers.onmousemove")}}</dt> - <dd>Called continously when the mouse is moved inside the window.</dd> - <dt>{{domxref("GlobalEventHandlers.onmouseout")}}</dt> - <dd>Called when the pointer leaves the window.</dd> - <dt>{{domxref("GlobalEventHandlers.onmouseover")}}</dt> - <dd>Called when the pointer enters the window</dd> - <dt>{{domxref("GlobalEventHandlers.onmouseup")}}</dt> - <dd>Called when ANY mouse button is released</dd> - <dt>{{domxref("WindowEventHandlers.onoffline")}}</dt> - <dd>Called when network connection is lost. See {{event("offline")}} event.</dd> - <dt>{{domxref("WindowEventHandlers.ononline")}}</dt> - <dd>Called when network connection is established. See {{event("online")}} event.</dd> - <dt>{{domxref("WindowEventHandlers.onpagehide")}}</dt> - <dd>Called when the user navigates away from the page, before the onunload event. See {{event("pagehide")}} event.</dd> - <dt>{{domxref("WindowEventHandlers.onpageshow")}}</dt> - <dd>Called after all resources and the DOM are fully loaded. See {{event("pageshow")}} event.</dd> - <dt>{{domxref("WindowEventHandlers.onpopstate")}}</dt> - <dd>Called when a back button is pressed.</dd> - <dt>{{domxref("GlobalEventHandlers.onreset")}}</dt> - <dd>Called when a form is reset</dd> - <dt>{{domxref("GlobalEventHandlers.onresize")}}</dt> - <dd>Called continuously as you are resizing the window.</dd> - <dt>{{domxref("GlobalEventHandlers.onscroll")}}</dt> - <dd>Called when the scroll bar is moved via ANY means. If the resource fully fits in the window, then this event cannot be invoked</dd> - <dt>{{domxref("GlobalEventHandlers.onwheel")}}</dt> - <dd>Called when the mouse wheel is rotated around any axis</dd> - <dt>{{domxref("GlobalEventHandlers.onselect")}}</dt> - <dd>Called after text in an input field is selected</dd> - <dt>{{domxref("GlobalEventHandlers.onselectionchange")}}</dt> - <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("selectionchange")}} event is raised.</dd> - <dt>{{domxref("WindowEventHandlers.onstorage")}}</dt> - <dd>Called when there is a change in session storage or local storage. See {{event("storage")}} event</dd> - <dt>{{domxref("GlobalEventHandlers.onsubmit")}}</dt> - <dd>Called when a form is submitted</dd> - <dt>{{domxref("WindowEventHandlers.onunhandledrejection")}} {{experimental_inline}}</dt> - <dd>An event handler for unhandled {{jsxref("Promise")}} rejection events.</dd> - <dt>{{domxref("WindowEventHandlers.onunload")}}</dt> - <dd>Called when the user navigates away from the page.</dd> -</dl> - -<h2 id="Events">Events</h2> - -<p>Listen to these events using <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code> or by assigning an event listener to the <code>on<em>eventname</em></code> property of this interface.</p> - -<dl> - <dt>{{domxref("Window/error_event", "error")}}</dt> - <dd>Fired when a resource failed to load, or can't be used. For example, if a script has an execution error or an image can't be found or is invalid.<br> - Also available via the {{domxref("GlobalEventHandlers/onerror", "onerror")}} property.</dd> - <dt>{{domxref("Window/languagechange_event", "languagechange")}}</dt> - <dd>Fired at the global scope object when the user's preferred language changes.<br> - Also available via the {{domxref("WindowEventHandlers/onlanguagechange", "onlanguagechange")}} property.</dd> - <dt>{{domxref("Window/orientationchange_event", "orientationchange")}}</dt> - <dd>Fired when the orientation of the device has changed.<br> - Also available via the {{domxref("Window/onorientationchange", "onorientationchange")}} property.</dd> - <dt>{{domxref("Window/devicemotion_event", "devicemotion")}}</dt> - <dd>Fired at a regular interval, indicating the amount of physical force of acceleration the device is receiving and the rate of rotation, if available.</dd> - <dt>{{domxref("Window/deviceorientation_event", "deviceorientation")}}</dt> - <dd>Fired when fresh data is available from the magnetometer orientation sensor about the current orientation of the device as compared to the Earth coordinate frame.</dd> - <dt>{{domxref("Document/defaultView/resize_event", "resize")}}</dt> - <dd>Fired when the window has been resized.<br> - Also available via the {{domxref("GlobalEventHandlers/onresize", "onresize")}} property.</dd> - <dt>{{domxref("Document/defaultView/storage_event", "storage")}}</dt> - <dd>Fired when a storage area (<code>localStorage</code> or <code>sessionStorage</code>) has been modified in the context of another document.<br> - Also available via the {{domxref("WindowEventHandlers/onstorage", "onstorage")}} property.</dd> -</dl> - -<h3 id="Animation_events">Animation events</h3> - -<dl> - <dt>{{domxref("Window/animationcancel_event", "animationcancel")}}</dt> - <dd>Fired when an animation unexpectedly aborts.<br> - Also available via the {{domxref("GlobalEventHandlers/onanimationcancel", "onanimationcancel")}} property.</dd> - <dt>{{domxref("Window/animationend_event", "animationend")}}</dt> - <dd>Fired when an animation has completed normally.<br> - Also available via the {{domxref("GlobalEventHandlers/onanimationend", "onanimationend")}} property.</dd> - <dt>{{domxref("Window/animationiteration_event", "animationiteration")}}</dt> - <dd>Fired when an animation iteration has completed.<br> - Also available via the {{domxref("GlobalEventHandlers/onanimationiteration", "onanimationiteration")}} property.</dd> - <dt>{{domxref("Window/animationstart_event", "animationstart")}}</dt> - <dd>Fired when an animation starts.<br> - Also available via the {{domxref("GlobalEventHandlers/onanimationstart", "onanimationstart")}} property.</dd> -</dl> - -<h3 id="Clipboard_events">Clipboard events</h3> - -<dl> - <dt>{{domxref("Window/clipboardchange_event", "clipboardchange")}}</dt> - <dd>Fired when the system clipboard content changes.</dd> - <dt>{{domxref("Window/copy_event", "copy")}}</dt> - <dd>Fired when the user initiates a copy action through the browser's user interface.<br> - Also available via the {{domxref("HTMLElement/oncopy", "oncopy")}} property.</dd> - <dt>{{domxref("Window/cut_event", "cut")}}</dt> - <dd>Fired when the user initiates a cut action through the browser's user interface.<br> - Also available via the {{domxref("HTMLElement/oncut", "oncut")}} property.</dd> - <dt>{{domxref("Window/paste_event", "paste")}}</dt> - <dd>Fired when the user initiates a paste action through the browser's user interface.<br> - Also available via the {{domxref("HTMLElement/onpaste", "onpaste")}} property.</dd> -</dl> - -<h3 id="Connection_events">Connection events</h3> - -<dl> - <dt>{{domxref("Window/offline_event", "offline")}}</dt> - <dd>Fired when the browser has lost access to the network and the value of <code>navigator.onLine</code> has switched to <code>false</code>.<br> - Also available via the {{domxref("WindowEventHandlers.onoffline", "onoffline")}} property.</dd> - <dt>{{domxref("Window/online_event", "online ")}}</dt> - <dd>Fired when the browser has gained access to the network and the value of <code>navigator.onLine</code> has switched to <code>true</code>.<br> - Also available via the {{domxref("WindowEventHandlers.ononline", "ononline")}} property.</dd> -</dl> - -<h3 id="Focus_events">Focus events</h3> - -<dl> - <dt>{{domxref("Window/blur_event", "blur")}}</dt> - <dd>Fired when an element has lost focus.<br> - Also available via the {{domxref("GlobalEventHandlers/onblur", "onblur")}} property.</dd> - <dt>{{domxref("Window/focus_event", "focus")}}</dt> - <dd>Fired when an element has gained focus.<br> - Also available via the {{domxref("GlobalEventHandlers/onfocus", "onfocus")}} property</dd> -</dl> - -<h3 id="Gamepad_events">Gamepad events</h3> - -<dl> - <dt>{{domxref("Window/gamepadconnected_event", "gamepadconnected")}}</dt> - <dd>Fired when the browser detects that a gamepad has been connected or the first time a button/axis of the gamepad is used.<br> - Also available via the {{domxref("Window/ongamepadconnected", "ongamepadconnected")}} property.</dd> - <dt>{{domxref("Window/gamepaddisconnected_event", "gamepaddisconnected")}}</dt> - <dd>Fired when the browser detects that a gamepad has been disconnected.<br> - Also available via the {{domxref("Window/ongamepaddisconnected", "ongamepaddisconnected")}} property</dd> -</dl> - -<h3 id="History_events">History events</h3> - -<dl> - <dt>{{domxref("Window/hashchange_event", "hashchange")}}</dt> - <dd>Fired when the fragment identifier of the URL has changed (the part of the URL beginning with and following the <code>#</code> symbol).<br> - Also available via the {{domxref("WindowEventHandlers/onhashchange", "onhashchange")}} property.</dd> - <dt>{{domxref("Window/pagehide_event", "pagehide")}}</dt> - <dd>Sent when the browser hides the current document while in the process of switching to displaying in its place a different document from the session's history. This happens, for example, when the user clicks the Back button or when they click the Forward button to move ahead in session history.<br> - Also available through the <code><a href="/en-US/docs/Mozilla/Tech/XUL/Attribute/onpagehide">onpagehide</a></code> event handler property.</dd> - <dt>{{domxref("Window/pageshow_event", "pageshow")}}</dt> - <dd>Sent when the browser makes the document visible due to navigation tasks, including not only when the page is first loaded, but also situations such as the user navigating back to the page after having navigated to another within the same tab.<br> - Also available using the <code><a href="/en-US/docs/Mozilla/Tech/XUL/Attribute/onpageshow">onpageshow</a></code> event handler property.</dd> - <dt><code>{{domxref("Window/popstate_event", "popstate")}}</code></dt> - <dd>Fired when the active history entry changes.<br> - Also available using the {{domxref("WindowEventHandlers/onpopstate", "onpopstate")}} event handler property.</dd> -</dl> - -<h3 id="Load_unload_events">Load & unload events</h3> - -<dl> - <dt>{{domxref("Window/beforeunload_event", "beforeunload")}}</dt> - <dd>Fired when the window, the document and its resources are about to be unloaded.<br> - Also available via the {{domxref("WindowEventHandlers/onbeforeunload", "onbeforeunload")}} property.</dd> - <dt>{{domxref("Window/DOMContentLoaded_event", "DOMContentLoaded")}}</dt> - <dd>Fired when the document has been completely loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading.</dd> - <dt>{{domxref("Window/load_event", "load")}}</dt> - <dd>Fired when the whole page has loaded, including all dependent resources such as stylesheets images.<br> - Also available via the {{domxref("GlobalEventHandlers/onload", "onload")}} property.</dd> - <dt>{{domxref("Window/unload_event", "unload")}}</dt> - <dd>Fired when the document or a child resource is being unloaded.<br> - Also available via the {{domxref("WindowEventHandlers/onunload", "onunload")}} property.</dd> -</dl> - -<h3 id="Manifest_events">Manifest events</h3> - -<dl> - <dt>{{domxref("Window/appinstalled_event", "appinstalled")}}</dt> - <dd>Fired when the browser has successfully installed a page as an application.<br> - Also available via the {{domxref("Window/onappinstalled", "onappinstalled")}} property.</dd> - <dt>{{domxref("Window/beforeinstallprompt_event", "beforeinstallprompt")}}</dt> - <dd>Fired when a user is about to be prompted to install a web application.<br> - Also available via the {{domxref("Window/onbeforeinstallprompt", "onbeforeinstallprompt")}} property.</dd> -</dl> - -<h3 id="Messaging_events">Messaging events</h3> - -<dl> - <dt>{{domxref("Window/message_event", "message")}}</dt> - <dd>Fired when the window receives a message, for example from a call to {{domxref("Window/postMessage", "Window.postMessage()")}} from another browsing context.<br> - Also available via the {{domxref("WindowEventHandlers/onmessage", "onmessage")}} property.</dd> - <dt>{{domxref("Window/messageerror_event", "messageerror")}}</dt> - <dd>Fired when a <code>Window</code> object receives a message that can't be deserialized.<br> - Also available via the {{domxref("WindowEventHandlers/onmessageerror", "onmessageerror")}} property.</dd> -</dl> - -<h3 id="Print_events">Print events</h3> - -<dl> - <dt>{{domxref("Window/afterprint_event", "afterprint")}}</dt> - <dd>Fired after the associated document has started printing or the print preview has been closed.<br> - Also available via the {{domxref("WindowEventHandlers/onafterprint", "onafterprint")}} property.</dd> - <dt>{{domxref("Window/beforeprint_event", "beforeprint")}}</dt> - <dd>Fired when the associated document is about to be printed or previewed for printing.<br> - Also available via the {{domxref("WindowEventHandlers/onbeforeprint", "onbeforeprint")}} property.</dd> -</dl> - -<h3 id="Promise_rejection_events">Promise rejection events</h3> - -<dl> - <dt>{{domxref("Window/rejectionhandled_event", "rejectionhandled")}}</dt> - <dd>Sent every time a JavaScript {{jsxref("Promise")}} is rejected, regardless of whether or not there is a handler in place to catch the rejection.<br> - Also available through the {{domxref("WindowEventHandlers/onrejectionhandled", "onrejectionhandled")}} event handler property.</dd> - <dt>{{domxref("Window/unhandledrejection_event", "unhandledrejection")}}</dt> - <dd>Sent when a JavaScript {{jsxref("Promise")}} is rejected but there is no handler in place to catch the rejection.<br> - Also available using the {{domxref("WindowEventHandlers/onunhandledrejection", "onunhandledrejection")}} event handler property.</dd> -</dl> - -<h3 id="Transition_events">Transition events</h3> - -<dl> - <dt>{{domxref("Window/transitioncancel_event", "transitioncancel")}}</dt> - <dd>Fired when a <a href="/en-US/docs/CSS/Using_CSS_transitions">CSS transition</a> is canceled.<br> - Also available via the {{domxref("GlobalEventHandlers/ontransitioncancel", "ontransitioncancel")}} property.</dd> - <dt>{{domxref("Window/transitionend_event", "transitionend")}}</dt> - <dd>Fired when a <a href="/en-US/docs/CSS/Using_CSS_transitions">CSS transition</a> has completed.<br> - Also available via the {{domxref("GlobalEventHandlers/ontransitionend", "ontransitionend")}} property.</dd> - <dt>{{domxref("Window/transitionrun_event", "transitionrun")}}</dt> - <dd>Fired when a <a href="/en-US/docs/CSS/Using_CSS_transitions">CSS transition</a> is first created.<br> - Also available via the {{domxref("GlobalEventHandlers/ontransitionrun", "ontransitionrun")}} property.</dd> - <dt>{{domxref("Window/transitionstart_event", "transitionstart")}}</dt> - <dd>Fired when a <a href="/en-US/docs/CSS/Using_CSS_transitions">CSS transition</a> has actually started.<br> - Also available via the {{domxref("GlobalEventHandlers/ontransitionstart", "ontransitionstart")}} property.</dd> -</dl> - -<h3 id="WebVR_events">WebVR events</h3> - -<dl> - <dt>{{domxref("Window/vrdisplayactivate_event", "vrdisplayactivate")}}</dt> - <dd>Fired when a VR display becomes available to be presented to, for example if an HMD has been moved to bring it out of standby, or woken up by being put on.<br> - Also available via the {{domxref("Window/onvrdisplayactivate", "onvrdisplayactivate")}} property.</dd> - <dt>{{domxref("Window/vrdisplayblur_event", "vrdisplayblur")}}</dt> - <dd>Fired when presentation to a VR display has been paused for some reason by the browser, OS, or VR hardware.<br> - Also available via the {{domxref("Window/onvrdisplayblur", "onvrdisplayblur")}} property.</dd> - <dt>{{domxref("Window/vrdisplayconnect_event", "vrdisplayconnect")}}</dt> - <dd>Fired when a compatible VR display is connected to the computer.<br> - Also available via the {{domxref("Window/onvrdisplayconnect", "onvrdisplayconnect")}} property.</dd> - <dt>{{domxref("Window/vrdisplaydeactivate_event", "vrdisplaydeactivate")}}</dt> - <dd>Fired when a VR display can no longer be presented to, for example if an HMD has gone into standby or sleep mode due to a period of inactivity.<br> - Also available via the {{domxref("Window/onvrdisplaydeactivate", "onvrdisplaydeactivate")}} property.</dd> - <dt>{{domxref("Window/vrdisplaydisconnect_event", "vrdisplaydisconnect")}}</dt> - <dd>Fired when a compatible VR display is disconnected from the computer.<br> - Also available via the {{domxref("Window/onvrdisplaydisconnect", "onvrdisplaydisconnect")}} property.</dd> - <dt>{{domxref("Window/vrdisplayfocus_event", "vrdisplayfocus")}}</dt> - <dd>Fired when presentation to a VR display has resumed after being blurred.<br> - Also available via the {{domxref("Window/onvrdisplayfocus", "onvrdisplayfocus")}} property.</dd> - <dt>{{domxref("Window/vrdisplaypresentchange_event", "vrdisplaypresentchange")}}</dt> - <dd>Fired when the presenting state of a VR display changes — i.e. goes from presenting to not presenting, or vice versa.<br> - Also available via the {{domxref("Window/onvrdisplaypresentchange", "onvrdisplaypresentchange")}} property.</dd> - <dt><font><font>{{domxref ("Window / vrdisplaypointerrestricted_event", "vrdisplaypointerrestricted")}}</font></font></dt> - <dd><font><font>ยิงเมื่อป้อนข้อมูลตัวชี้แสดงผล VR ของถูก จำกัด การบริโภคผ่าน</font><font>องค์ประกอบ</font></font><a href="/en-US/docs/Web/API/Pointer_Lock_API"><font><font> pointerlocked </font></font></a><br> - <font><font>พร้อมใช้งานผ่านคุณสมบัติ {{domxref ("Window / onvrdisplaypointerrestricted", "onvrdisplaypointerrestricted")}}</font></font></dd> - <dt><font><font>{{domxref ("Window / vrdisplaypointerunrestricted_event", "vrdisplaypointerunrestricted")}}</font></font></dt> - <dd><font><font>ยิงเมื่อป้อนข้อมูลตัวชี้แสดงผล VR จะไม่ถูก จำกัด การบริโภคผ่าน</font><font>องค์ประกอบ</font></font><a href="/en-US/docs/Web/API/Pointer_Lock_API"><font><font> pointerlocked </font></font></a><br> - <font><font>พร้อมใช้งานผ่านคุณสมบัติ {{domxref ("Window / onvrdisplaypointerunrestricted", "onvrdisplaypointerunrestricted")}}</font></font></dd> -</dl> - -<h2 id="อินเทอร์เฟซ"><font><font>อินเทอร์เฟซ</font></font></h2> - -<p><font><font>ดู</font></font><a href="/en-US/docs/DOM/DOM_Reference" title="/ en-US / docs / DOM / DOM_Reference"><font><font>DOM </font></font></a><font><font>อ้างอิง</font></font></p> - -<h2 id="ความเข้ากันได้ของเบราว์เซอร์"><font><font>ความเข้ากันได้ของเบราว์เซอร์</font></font></h2> - -<div class="hidden"><font><font>ตารางความเข้ากันได้ในหน้านี้สร้างขึ้นจากข้อมูลที่มีโครงสร้าง </font><font>หากคุณต้องการมีส่วนร่วมในข้อมูลโปรดดู</font></font><a href="https://github.com/mdn/browser-compat-data"><font><font>https://github.com/mdn/browser-compat-data</font></font></a><font><font>และส่งคำขอดึงข้อมูลมาให้เรา</font></font></div> - -<p><font><font>{{Compat ("api.Window")}}</font></font></p> diff --git a/files/th/web/api/xmlhttprequest/index.html b/files/th/web/api/xmlhttprequest/index.html deleted file mode 100644 index 015d252f1d..0000000000 --- a/files/th/web/api/xmlhttprequest/index.html +++ /dev/null @@ -1,186 +0,0 @@ ---- -title: XMLHttpRequest -slug: Web/API/XMLHttpRequest -translation_of: Web/API/XMLHttpRequest ---- -<div>{{APIRef("XMLHttpRequest") }}</div> - -<p><span class="seoSummary"><font>ใช้วัตถุ (XHR) เพื่อโต้ตอบกับเซิร์ฟเวอร์ คุณสามารถดึงข้อมูลจาก URL โดยไม่ต้องทำการฟื้นฟูเต็มหน้า เว็บเพจการปรับปรุงเพียงบางส่วนของหน้าโดยไม่กระทบกับสิ่งที่ผู้ใช้จะทำได้</font><code>XMLHttpRequest</code></span> <code>XMLHttpRequest</code><font> ใช้มากใน {{Glossary("AJAX") }} เขียนโปรแกรม</font></p> - -<p>{{InheritanceDiagram (650, 150) }}</p> - -<p><font>แม้จะชื่อ สามารถใช้ในการดึงข้อมูลทุกประเภทของข้อมูล XML ไม่เพียง</font><code>XMLHttpRequest</code></p> - -<p>ถ้าจำเป็นต้องเกี่ยวข้องกับการได้รับข้อมูลเหตุการณ์หรือข้อความจากเซิร์ฟเวอร์สื่อสารของคุณ ลองใช้<a href="/en-US/docs/Web/API/Server-sent_events">กิจกรรมเซิร์ฟเวอร์ส่ง</a>ผ่านอินเทอร์เฟซ {{domxref("EventSource") }} สำหรับเพล็กซ์การสื่อสาร<a href="/en-US/docs/Web/API/WebSockets_API">WebSockets</a>อาจเป็นทางเลือกที่ดี</p> - -<h2 id="Constructor">Constructor</h2> - -<dl> - <dt>{{domxref("XMLHttpRequest.XMLHttpRequest", "XMLHttpRequest()")}}</dt> - <dd>The constructor initializes an XMLHttpRequest. It must be called before any other method calls.</dd> -</dl> - -<h2 id="Properties">Properties</h2> - -<p><em>This interface also inherits properties of {{domxref("XMLHttpRequestEventTarget")}} and of {{domxref("EventTarget")}}.</em></p> - -<dl> - <dt id="xmlhttprequest-onreadystatechange">{{domxref("XMLHttpRequest.onreadystatechange")}}</dt> - <dd><font>An {{domxref("EventHandler")}} that is called whenever the attribute changes.</font><code>readyState</code></dd> - <dt id="xmlhttprequest-readystate">{{domxref("XMLHttpRequest.readyState")}} {{readonlyinline}}</dt> - <dd><font>Returns an , the state of the request.</font><code>unsigned short</code></dd> - <dt>{{domxref("XMLHttpRequest.response")}} {{readonlyinline}}</dt> - <dd>Returns an {{jsxref("ArrayBuffer")}}, {{domxref("Blob")}}, {{domxref("Document")}}, JavaScript object, or a {{domxref("DOMString")}}, depending on the value of {{domxref("XMLHttpRequest.responseType")}}, that contains the response entity body.</dd> - <dt id="xmlhttprequest-responsetext">{{domxref("XMLHttpRequest.responseText")}} {{readonlyinline}}</dt> - <dd><font>Returns a {{domxref("DOMString")}} that contains the response to the request as text, or if the request was unsuccessful or has not yet been sent.</font><code>null</code></dd> - <dt id="xmlhttprequest-responsetype">{{domxref("XMLHttpRequest.responseType")}}</dt> - <dd>Is an enumerated value that defines the response type.</dd> - <dt id="xmlhttprequest-responsexml">{{domxref("XMLHttpRequest.responseURL")}} {{readonlyinline}}</dt> - <dd>Returns the serialized URL of the response or the empty string if the URL is null.</dd> - <dt id="xmlhttprequest-responsexml">{{domxref("XMLHttpRequest.responseXML")}} {{readonlyinline}}</dt> - <dd><font>Returns a {{domxref("Document")}} containing the response to the request, or if the request was unsuccessful, has not yet been sent, or cannot be parsed as XML or HTML. Not available in workers.</font><code>null</code></dd> - <dt id="xmlhttprequest-status">{{domxref("XMLHttpRequest.status")}} {{readonlyinline}}</dt> - <dd><font>Returns an with the status of the response of the request.</font><code>unsigned short</code></dd> - <dt id="xmlhttprequest-statustext">{{domxref("XMLHttpRequest.statusText")}} {{readonlyinline}}</dt> - <dd><font>Returns a {{domxref("DOMString")}} containing the response string returned by the HTTP server. Unlike {{domxref("XMLHttpRequest.status")}}, this includes the entire text of the response message ("", for example).</font><code>200 OK</code></dd> -</dl> - -<div class="note"> -<p><strong>Note:</strong> According to the HTTP/2 specification (<a href="https://http2.github.io/http2-spec/#rfc.section.8.1.2.4">8.1.2.4</a> <a href="https://http2.github.io/http2-spec/#HttpResponse">Response Pseudo-Header Fields</a>), HTTP/2 does not define a way to carry the version or reason phrase that is included in an HTTP/1.1 status line.</p> -</div> - -<dl> - <dt id="xmlhttprequest-timeout">{{domxref("XMLHttpRequest.timeout")}}</dt> - <dd><font>Is an representing the number of milliseconds a request can take before automatically being terminated.</font><code>unsigned long</code></dd> - <dt id="xmlhttprequesteventtarget-ontimeout">{{domxref("XMLHttpRequestEventTarget.ontimeout")}}</dt> - <dd>Is an {{domxref("EventHandler")}} that is called whenever the request times out. {{gecko_minversion_inline("12.0")}}</dd> - <dt id="xmlhttprequest-upload">{{domxref("XMLHttpRequest.upload")}} {{readonlyinline}}</dt> - <dd>Is an {{domxref("XMLHttpRequestUpload")}}, representing the upload process.</dd> - <dt id="xmlhttprequest-withcredentials">{{domxref("XMLHttpRequest.withCredentials")}}</dt> - <dd><font>Is a {{domxref("Boolean")}} that indicates whether or not cross-site requests should be made using credentials such as cookies or authorization headers.</font><code>Access-Control</code></dd> -</dl> - -<h3 id="Non-standard_properties">Non-standard properties</h3> - -<dl> - <dt>{{domxref("XMLHttpRequest.channel")}}{{ReadOnlyInline}}</dt> - <dd>Is a {{Interface("nsIChannel")}}. The channel used by the object when performing the request.</dd> - <dt>{{domxref("XMLHttpRequest.mozAnon")}}{{ReadOnlyInline}}</dt> - <dd>Is a boolean. If true, the request will be sent without cookie and authentication headers.</dd> - <dt>{{domxref("XMLHttpRequest.mozSystem")}}{{ReadOnlyInline}}</dt> - <dd>Is a boolean. If true, the same origin policy will not be enforced on the request.</dd> - <dt>{{domxref("XMLHttpRequest.mozBackgroundRequest")}}</dt> - <dd>Is a boolean. It indicates whether or not the object represents a background service request.</dd> - <dt>{{domxref("XMLHttpRequest.mozResponseArrayBuffer")}}{{gecko_minversion_inline("2.0")}} {{obsolete_inline("6")}} {{ReadOnlyInline}}</dt> - <dd>{{jsxref("ArrayBuffer")}}. The response to the request, as a JavaScript typed array.</dd> - <dt>{{domxref("XMLHttpRequest.multipart")}}{{obsolete_inline("22")}}</dt> - <dd><font><strong>This Gecko-only feature, a boolean, was removed in Firefox/Gecko 22.</strong> Please use <a href="/en-US/docs/Web/API/Server-sent_events">Server-Sent Events</a>, <a href="/en-US/docs/Web/API/WebSockets_API">Web Sockets</a>, or from progress events instead.</font><code>responseText</code></dd> -</dl> - -<h3 id="Event_handlers">Event handlers</h3> - -<p><code>onreadystatechange</code><font> as a property of the instance is supported in all browsers.</font><code>XMLHttpRequest</code></p> - -<p><font>Since then, a number of additional event handlers have been implemented in various browsers (, , , etc.). See <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest">Using XMLHttpRequest</a>.</font><code>onload</code><code>onerror</code><code>onprogress</code></p> - -<p><font>More recent browsers, including Firefox, also support listening to the events via standard {{domxref("EventTarget.addEventListener", "addEventListener()")}} APIs in addition to setting properties to a handler function.</font><code>XMLHttpRequest</code><code>on*</code></p> - -<h2 id="Methods">Methods</h2> - -<dl> - <dt>{{domxref("XMLHttpRequest.abort()")}}</dt> - <dd>Aborts the request if it has already been sent.</dd> - <dt>{{domxref("XMLHttpRequest.getAllResponseHeaders()")}}</dt> - <dd><font>Returns all the response headers, separated by {{Glossary("CRLF")}}, as a string, or if no response has been received.</font><code>null</code></dd> - <dt>{{domxref("XMLHttpRequest.getResponseHeader()")}}</dt> - <dd><font>Returns the string containing the text of the specified header, or if either the response has not yet been received or the header doesn't exist in the response.</font><code>null</code></dd> - <dt>{{domxref("XMLHttpRequest.open()")}}</dt> - <dd>Initializes a request. This method is to be used from JavaScript code; to initialize a request from native code, use <a class="internal" href="/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIXMLHttpRequest#openRequest()"><code>openRequest()</code></a> instead.</dd> - <dt>{{domxref("XMLHttpRequest.overrideMimeType()")}}</dt> - <dd>Overrides the MIME type returned by the server.</dd> - <dt>{{domxref("XMLHttpRequest.send()")}}</dt> - <dd>Sends the request. If the request is asynchronous (which is the default), this method returns as soon as the request is sent.</dd> - <dt>{{domxref("XMLHttpRequest.setRequestHeader()")}}</dt> - <dd><font>Sets the value of an HTTP request header. You must call after <a href="#open"><code>open()</code></a>, but before .</font><code>setRequestHeader()</code><code>send()</code></dd> -</dl> - -<h3 id="Non-standard_methods">Non-standard methods</h3> - -<dl> - <dt>{{domxref("XMLHttpRequest.init()")}}</dt> - <dd>Initializes the object for use from C++ code.</dd> -</dl> - -<div class="warning"><strong>Warning:</strong> This method must <em>not</em> be called from JavaScript.</div> - -<dl> - <dt>{{domxref("XMLHttpRequest.openRequest()")}}</dt> - <dd><font>Initializes a request. This method is to be used from native code; to initialize a request from JavaScript code, use <a class="internal" href="/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIXMLHttpRequest#open()"><code>open()</code></a> instead. See the documentation for .</font><code>open()</code></dd> - <dt>{{domxref("XMLHttpRequest.sendAsBinary()")}}{{deprecated_inline()}}</dt> - <dd><font>A variant of the method that sends binary data.</font><code>send()</code></dd> -</dl> - -<h2 id="Events">Events</h2> - -<dl> - <dt>{{domxref("XMLHttpRequest/abort_event", "abort")}}</dt> - <dd>Fired when a request has been aborted, for example because the program called {{domxref("XMLHttpRequest.abort()")}}.<br> - Also available via the {{domxref("XMLHttpRequestEventTarget/onabort", "onabort")}} property.</dd> - <dt>{{domxref("XMLHttpRequest/error_event", "error")}}</dt> - <dd>Fired when the request encountered an error.<br> - Also available via the {{domxref("XMLHttpRequestEventTarget/onerror", "onerror")}} property.</dd> - <dt>{{domxref("XMLHttpRequest/load_event", "load")}}</dt> - <dd>Fired when an {{domxref("XMLHttpRequest")}} transaction completes successfully.<br> - Also available via the {{domxref("XMLHttpRequestEventTarget/onload", "onload")}} property.</dd> - <dt>{{domxref("XMLHttpRequest/loadend_event", "loadend")}}</dt> - <dd>Fired when a request has completed, whether successfully (after {{domxref("XMLHttpRequest/load_event", "load")}}) or unsuccessfully (after {{domxref("XMLHttpRequest/abort_event", "abort")}} or {{domxref("XMLHttpRequest/error_event", "error")}}).<br> - Also available via the {{domxref("XMLHttpRequestEventTarget/onloadend", "onloadend")}} property.</dd> - <dt>{{domxref("XMLHttpRequest/loadstart_event", "loadstart")}}</dt> - <dd>Fired when a request has started to load data.<br> - Also available via the {{domxref("XMLHttpRequestEventTarget/onloadstart", "onloadstart")}} property.</dd> - <dt>{{domxref("XMLHttpRequest/progress_event", "progress")}}</dt> - <dd>Fired periodically when a request receives more data.<br> - Also available via the {{domxref("XMLHttpRequestEventTarget/onprogress", "onprogress")}} property.</dd> - <dt>{{domxref("XMLHttpRequest/timeout_event", "timeout")}}</dt> - <dd>Fired when progress is terminated due to preset time expiring.<br> - Also available via the {{domxref("XMLHttpRequestEventTarget/ontimeout", "ontimeout")}} property.</dd> -</dl> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('XMLHttpRequest')}}</td> - <td>{{Spec2('XMLHttpRequest')}}</td> - <td>Live standard, latest version</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - - - -<div>{{Compat("api.XMLHttpRequest")}}</div> - -<h2 id="See_also">See also</h2> - -<ul> - <li>{{domxref("XMLSerializer")}}: Serializing a DOM tree into XML</li> - <li><font>MDN tutorials covering :</font><code>XMLHttpRequest</code> - <ul> - <li><a href="/en-US/docs/AJAX/Getting_Started">Ajax — Getting Started</a></li> - <li><a href="/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest">Using XMLHttpRequest</a></li> - <li><a href="/en-US/docs/Web/API/XMLHttpRequest/HTML_in_XMLHttpRequest">HTML in XMLHttpRequest</a></li> - </ul> - </li> - <li><a class="external" href="http://www.html5rocks.com/en/tutorials/file/xhr2/">HTML5 Rocks — New Tricks in XMLHttpRequest2</a></li> -</ul> diff --git a/files/th/web/api/xrreferencespacetype/index.html b/files/th/web/api/xrreferencespacetype/index.html deleted file mode 100644 index 924dc67251..0000000000 --- a/files/th/web/api/xrreferencespacetype/index.html +++ /dev/null @@ -1,78 +0,0 @@ ---- -title: XRReferenceSpaceType -slug: Web/API/XRReferenceSpaceType -translation_of: Web/API/XRReferenceSpaceType ---- -<p>{{APIRef("WebXR Device API")}}</p> - -<p><span class="seoSummary">The <code><strong>XRReferenceSpaceType</strong></code> enumerated type defines the strings which identify the types of reference spaces supported by WebXR.</span> This type is used when calling the {{domxref("XRSession.requestReferenceSpace", "requestReferenceSpace()")}} method to obtain a reference space for an {{domxref("XRSession")}}.</p> - -<h2 id="Values">Values</h2> - -<p>The reference space returned by {{domxref("XRSession.requestReferenceSpace()")}} is either {{domxref("XRReferenceSpace")}} or {{domxref("XRBoundedReferenceSpace")}}. The "Interface" column in the table below indicates which of the two types is returned for each reference space type constant.</p> - -<div id="value-list"> -<table class="standard-table"> - <thead> - <tr> - <th scope="col">XRReferenceSpaceType</th> - <th scope="col">Description</th> - <th scope="col">Interface</th> - </tr> - </thead> - <tbody> - <tr> - <td><a id="bounded-floor" name="bounded-floor"><code>bounded-floor</code></a></td> - <td>Similar to the <code>local</code> type, except the user is not expected to move outside a predetermined boundary, given by the {{domxref("XRBoundedReferenceSpace.boundsGeometry", "boundsGeometry")}} in the returned object.</td> - <td>{{domxref("XRBoundedReferenceSpace")}}</td> - </tr> - <tr> - <td><a id="local" name="local"><code>local</code></a></td> - <td> - <p>A tracking space whose native origin is located near the viewer's position at the time the session was created. The exact position depends on the underlying platform and implementation. The user isn't expected to move much if at all beyond their starting position, and tracking is optimized for this use case.</p> - - <p>For devices with six degrees of freedom (6DoF) tracking, the <code>local</code> reference space tries to keep the origin stable relative to the environment.</p> - </td> - <td>{{domxref("XRReferenceSpace")}}</td> - </tr> - <tr> - <td><a id="local-floor" name="local-floor"><code>local-floor</code></a></td> - <td>Similar to the <code>local</code> type, except the starting position is placed in a safe location for the viewer to stand, where the value of the y axis is 0 at floor level. If that floor level isn't known, the {{Glossary("user agent")}} will estimate the floor level. If the estimated floor level is non-zero, the browser is expected to round it such a way as to avoid fingerprinting (likely to the nearest centimeter).</td> - <td>{{domxref("XRReferenceSpace")}}</td> - </tr> - <tr> - <td><a id="unbounded" name="unbounded"><code>unbounded</code></a></td> - <td>A tracking space which allows the user total freedom of movement, possibly over extremely long distances from their origin point. The viewer isn't tracked at all; tracking is optimized for stability around the user's current position, so the native origin may drift as needed to accommodate that need.</td> - <td>{{domxref("XRReferenceSpace")}}</td> - </tr> - <tr> - <td><a id="viewer" name="viewer"><code>viewer</code></a></td> - <td><font><font>พื้นที่ติดตามที่แหล่งกำเนิดดั้งเดิมติดตามตำแหน่งและทิศทางของผู้ดู </font><font>สิ่งนี้ใช้สำหรับสภาพแวดล้อมที่ผู้ใช้สามารถย้ายไปรอบ ๆ ทางกายภาพและได้รับการสนับสนุนโดย {{domxref ("XRSession")}} ทั้งหมดทั้งที่ดื่มด่ำและอินไลน์แม้ว่าจะมีประโยชน์มากที่สุดสำหรับเซสชันอินไลน์ </font><font>มันมีประโยชน์อย่างยิ่งเมื่อกำหนดระยะห่างระหว่างวิวเวอร์กับอินพุตหรือเมื่อทำงานกับออฟเซ็ตเว้นวรรค </font><font>มิฉะนั้นโดยทั่วไปหนึ่งในประเภทพื้นที่อ้างอิงอื่น ๆ จะถูกใช้บ่อยกว่า</font></font></td> - <td><font><font>{{domxref ( "XRReferenceSpace")}}</font></font></td> - </tr> - </tbody> -</table> -</div> - -<h2 id="ข้อมูลจำเพาะ"><font><font>ข้อมูลจำเพาะ</font></font></h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col"><font><font>สเปค</font></font></th> - <th scope="col"><font><font>สถานะ</font></font></th> - <th scope="col"><font><font>คิดเห็น</font></font></th> - </tr> - </thead> - <tbody> - <tr> - <td><font><font>{{SpecName ( 'WebXR', '# enumdef-xrreferencespacetype', 'XRReferenceSpaceType')}}</font></font></td> - <td><font><font>{{Spec2 ( 'WebXR')}}</font></font></td> - <td><font><font>คำจำกัดความเบื้องต้น</font></font></td> - </tr> - </tbody> -</table> - -<h2 id="ความเข้ากันได้ของเบราว์เซอร์"><font><font>ความเข้ากันได้ของเบราว์เซอร์</font></font></h2> - -<p><font><font>{{compat ( "api.XRReferenceSpaceType")}}</font></font></p> |