diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:41:45 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:41:45 -0500 |
commit | 1109132f09d75da9a28b649c7677bb6ce07c40c0 (patch) | |
tree | 0dd8b084480983cf9f9680e8aedb92782a921b13 /files/he/web/api | |
parent | 4b1a9203c547c019fc5398082ae19a3f3d4c3efe (diff) | |
download | translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.gz translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.bz2 translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.zip |
initial commit
Diffstat (limited to 'files/he/web/api')
25 files changed, 3566 insertions, 0 deletions
diff --git a/files/he/web/api/console/index.html b/files/he/web/api/console/index.html new file mode 100644 index 0000000000..61521af0f3 --- /dev/null +++ b/files/he/web/api/console/index.html @@ -0,0 +1,294 @@ +--- +title: Console +slug: Web/API/Console +tags: + - API + - Debugging + - Interface + - NeedsTranslation + - Reference + - TopicStub + - console + - web console +translation_of: Web/API/Console +--- +<div>{{APIRef("Console API")}}</div> + +<p>The <strong><code>Console</code></strong> object provides access to the browser's debugging console (e.g. the <a href="/en-US/docs/Tools/Web_Console">Web Console</a> in Firefox). The specifics of how it works varies from browser to browser, but there is a <em>de facto</em> set of features that are typically provided.</p> + +<p>The <code>Console</code> object can be accessed from any global object. {{domxref("Window")}} on browsing scopes and {{domxref("WorkerGlobalScope")}} as specific variants in workers via the property console. It's exposed as {{domxref("Window.console")}}, and can be referenced as simply <code>console</code>. For example:</p> + +<pre class="brush: js">console.log("Failed to open the specified link")</pre> + +<p>This page documents the {{anch("Methods")}} available on the <code>Console</code> object and gives a few {{anch("Usage")}} examples.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Methods">Methods</h2> + +<dl> + <dt>{{domxref("Console.assert()")}}</dt> + <dd>Log a message and stack trace to console if the first argument is <code>false</code>.</dd> + <dt>{{domxref("Console.clear()")}}</dt> + <dd>Clear the console.</dd> + <dt>{{domxref("Console.count()")}}</dt> + <dd>Log the number of times this line has been called with the given label.</dd> + <dt>{{domxref("Console.countReset()")}}</dt> + <dd>Resets the value of the counter with the given label.</dd> + <dt>{{domxref("Console.debug()")}}</dt> + <dd>Outputs a message to the console with the log level <code>"debug"</code>. + <div class="note"><strong>Note</strong>: Starting with Chromium 58 this method only appears in Chromium browser consoles when level "Verbose" is selected.</div> + </dd> + <dt>{{domxref("Console.dir()")}}</dt> + <dd>Displays an interactive listing of the properties of a specified JavaScript object. This listing lets you use disclosure triangles to examine the contents of child objects.</dd> + <dt>{{domxref("Console.dirxml()")}}</dt> + <dd> + <p>Displays an XML/HTML Element representation of the specified object if possible or the JavaScript Object view if it is not possible.</p> + </dd> + <dt>{{domxref("Console.error()")}}</dt> + <dd>Outputs an error message. You may use <a href="/en-US/docs/Web/API/console#Using_string_substitutions">string substitution</a> and additional arguments with this method.</dd> + <dt>{{domxref("Console.exception()")}} {{Non-standard_inline}} {{deprecated_inline}}</dt> + <dd>An alias for <code>error()</code>.</dd> + <dt>{{domxref("Console.group()")}}</dt> + <dd>Creates a new inline <a href="/en-US/docs/Web/API/console#Using_groups_in_the_console">group</a>, indenting all following output by another level. To move back out a level, call <code>groupEnd()</code>.</dd> + <dt>{{domxref("Console.groupCollapsed()")}}</dt> + <dd>Creates a new inline <a href="/en-US/docs/Web/API/console#Using_groups_in_the_console">group</a>, indenting all following output by another level. However, unlike <code>group()</code> this starts with the inline group collapsed requiring the use of a disclosure button to expand it. To move back out a level, call <code>groupEnd()</code>.</dd> + <dt>{{domxref("Console.groupEnd()")}}</dt> + <dd>Exits the current inline <a href="/en-US/docs/Web/API/console#Using_groups_in_the_console">group</a>.</dd> + <dt>{{domxref("Console.info()")}}</dt> + <dd>Informative logging of information. You may use <a href="/en-US/docs/Web/API/console#Using_string_substitutions">string substitution</a> and additional arguments with this method.</dd> + <dt>{{domxref("Console.log()")}}</dt> + <dd>For general output of logging information. You may use <a href="/en-US/docs/Web/API/console#Using_string_substitutions">string substitution</a> and additional arguments with this method.</dd> + <dt>{{domxref("Console.profile()")}} {{Non-standard_inline}}</dt> + <dd>Starts the browser's built-in profiler (for example, the <a href="/en-US/docs/Tools/Performance">Firefox performance tool</a>). You can specify an optional name for the profile.</dd> + <dt>{{domxref("Console.profileEnd()")}} {{Non-standard_inline}}</dt> + <dd>Stops the profiler. You can see the resulting profile in the browser's performance tool (for example, the <a href="/en-US/docs/Tools/Performance">Firefox performance tool</a>).</dd> + <dt>{{domxref("Console.table()")}}</dt> + <dd>Displays tabular data as a table.</dd> + <dt>{{domxref("Console.time()")}}</dt> + <dd>Starts a <a href="/en-US/docs/Web/API/console#Timers">timer</a> with a name specified as an input parameter. Up to 10,000 simultaneous timers can run on a given page.</dd> + <dt>{{domxref("Console.timeEnd()")}}</dt> + <dd>Stops the specified <a href="/en-US/docs/Web/API/console#Timers">timer</a> and logs the elapsed time in seconds since it started.</dd> + <dt>{{domxref("Console.timeLog()")}}</dt> + <dd>Logs the value of the specified <a href="/en-US/docs/Web/API/console#Timers">timer</a> to the console.</dd> + <dt>{{domxref("Console.timeStamp()")}} {{Non-standard_inline}}</dt> + <dd>Adds a marker to the browser's <a href="https://developer.chrome.com/devtools/docs/timeline">Timeline</a> or <a href="/en-US/docs/Tools/Performance/Waterfall">Waterfall</a> tool.</dd> + <dt>{{domxref("Console.trace()")}}</dt> + <dd>Outputs a <a href="/en-US/docs/Web/API/console#Stack_traces">stack trace</a>.</dd> + <dt>{{domxref("Console.warn()")}}</dt> + <dd>Outputs a warning message. You may use <a href="/en-US/docs/Web/API/console#Using_string_substitutions">string substitution</a> and additional arguments with this method.</dd> +</dl> + +<h2 id="Usage" name="Usage">Usage</h2> + +<h3 id="Outputting_text_to_the_console" name="Outputting_text_to_the_console">Outputting text to the console</h3> + +<p>The most frequently-used feature of the console is logging of text and other data. There are four categories of output you can generate, using the {{domxref("console.log()")}}, {{domxref("console.info()")}}, {{domxref("console.warn()")}}, and {{domxref("console.error()")}} methods respectively. Each of these results in output styled differently in the log, and you can use the filtering controls provided by your browser to only view the kinds of output that interest you.</p> + +<p>There are two ways to use each of the output methods; you can simply pass in a list of objects whose string representations get concatenated into one string, then output to the console, or you can pass in a string containing zero or more substitution strings followed by a list of objects to replace them.</p> + +<h4 id="Outputting_a_single_object">Outputting a single object</h4> + +<p>The simplest way to use the logging methods is to output a single object:</p> + +<pre class="brush: js">var someObject = { str: "Some text", id: 5 }; +console.log(someObject); +</pre> + +<p>The output looks something like this:</p> + +<pre>[09:27:13.475] ({str:"Some text", id:5})</pre> + +<h4 id="Outputting_multiple_objects">Outputting multiple objects</h4> + +<p>You can also output multiple objects by simply listing them when calling the logging method, like this:</p> + +<pre class="brush: js">var car = "Dodge Charger"; +var someObject = { str: "Some text", id: 5 }; +console.info("My first car was a", car, ". The object is:", someObject);</pre> + +<p>This output will look like this:</p> + +<pre>[09:28:22.711] My first car was a Dodge Charger . The object is: ({str:"Some text", id:5}) +</pre> + +<h4 id="Using_string_substitutions">Using string substitutions</h4> + +<p>Gecko 9.0 {{geckoRelease("9.0")}} introduced support for string substitutions. When passing a string to one of the console object's methods that accepts a string, you may use these substitution strings:</p> + +<table class="standard-table" style="width: auto;"> + <tbody> + <tr> + <td class="header">Substitution string</td> + <td class="header">Description</td> + </tr> + <tr> + <td>%o or %O</td> + <td>Outputs a JavaScript object. Clicking the object name opens more information about it in the inspector.</td> + </tr> + <tr> + <td>%d or %i</td> + <td>Outputs an integer. Number formatting is supported, for example <code>console.log("Foo %.2d", 1.1)</code> will output the number as two significant figures with a leading 0: <code>Foo 01</code></td> + </tr> + <tr> + <td>%s</td> + <td>Outputs a string.</td> + </tr> + <tr> + <td>%f</td> + <td>Outputs a floating-point value. Formatting is supported, for example <code>console.log("Foo %.2f", 1.1)</code> will output the number to 2 decimal places: <code>Foo 1.10</code></td> + </tr> + </tbody> +</table> + +<div class="note"> +<p><strong>Note</strong>: Precision formatting doesn't work in Chrome</p> +</div> + +<p>Each of these pulls the next argument after the format string off the parameter list. For example:</p> + +<pre>for (var i=0; i<5; i++) { + console.log("Hello, %s. You've called me %d times.", "Bob", i+1); +} +</pre> + +<p>The output looks like this:</p> + +<pre>[13:14:13.481] Hello, Bob. You've called me 1 times. +[13:14:13.483] Hello, Bob. You've called me 2 times. +[13:14:13.485] Hello, Bob. You've called me 3 times. +[13:14:13.487] Hello, Bob. You've called me 4 times. +[13:14:13.488] Hello, Bob. You've called me 5 times. +</pre> + +<h4 id="Styling_console_output">Styling console output</h4> + +<p>You can use the <code>%c</code> directive to apply a CSS style to console output:</p> + +<pre class="brush: js">console.log("This is %cMy stylish message", "color: yellow; font-style: italic; background-color: blue;padding: 2px");</pre> + +<div>The text before the directive will not be affected, but the text after the directive will be styled using the CSS declarations in the parameter.</div> + +<div> </div> + +<div><img alt="" src="https://mdn.mozillademos.org/files/12527/CSS-styling.png" style="display: block; margin: 0 auto;"></div> + +<div> </div> + +<div class="note"> +<p><strong>Note</strong>: Quite a few CSS properties are supported by this styling; you should experiment and see which ones prove useful.</p> +</div> + +<div> </div> + +<div>{{h3_gecko_minversion("Using groups in the console", "9.0")}}</div> + +<p>You can use nested groups to help organize your output by visually combining related material. To create a new nested block, call <code>console.group()</code>. The <code>console.groupCollapsed()</code> method is similar but creates the new block collapsed, requiring the use of a disclosure button to open it for reading.</p> + +<div class="note"><strong>Note:</strong> Collapsed groups are not supported yet in Gecko; the <code>groupCollapsed()</code> method is the same as <code>group()</code> at this time.</div> + +<p>To exit the current group, simply call <code>console.groupEnd()</code>. For example, given this code:</p> + +<pre class="brush: js">console.log("This is the outer level"); +console.group(); +console.log("Level 2"); +console.group(); +console.log("Level 3"); +console.warn("More of level 3"); +console.groupEnd(); +console.log("Back to level 2"); +console.groupEnd(); +console.debug("Back to the outer level"); +</pre> + +<p>The output looks like this:</p> + +<p><img alt="nesting.png" class="default internal" src="/@api/deki/files/6082/=nesting.png"></p> + +<div>{{h3_gecko_minversion("Timers", "10.0")}}</div> + +<p>In order to calculate the duration of a specific operation, Gecko 10 introduced the support of timers in the <code>console</code> object. To start a timer, call the <code>console.time</code><code>()</code> method, giving it a name as the only parameter. To stop the timer, and to get the elapsed time in milliseconds, just call the <code>console.timeEnd()</code> method, again passing the timer's name as the parameter. Up to 10,000 timers can run simultaneously on a given page.</p> + +<p>For example, given this code:</p> + +<pre class="brush: js">console.time("answer time"); +alert("Click to continue"); +console.timeLog("answer time"); +alert("Do a bunch of other stuff..."); +console.timeEnd("answer time"); +</pre> + +<p>Will log the time needed by the user to dismiss the alert box, log the time to the console, wait for the user to dismiss the second alert, and then log the ending time to the console:</p> + +<p><img alt="timerresult.png" class="default internal" src="https://mdn.mozillademos.org/files/16113/console-timeLog.png" style="border: 1px solid black; height: 102px; margin: 0 auto; width: 318px;"></p> + +<p>Notice that the timer's name is displayed both when the timer is started and when it's stopped.</p> + +<div class="note"><strong>Note:</strong> It's important to note that if you're using this to log the timing for network traffic, the timer will report the total time for the transaction, while the time listed in the network panel is just the amount of time required for the header. If you have response body logging enabled, the time listed for the response header and body combined should match what you see in the console output.</div> + +<h3 id="Stack_traces">Stack traces</h3> + +<p>The console object also supports outputting a stack trace; this will show you the call path taken to reach the point at which you call {{domxref("console.trace()")}}. Given code like this:</p> + +<pre class="brush: js">function foo() { + function bar() { + console.trace(); + } + bar(); +} + +foo(); +</pre> + +<p>The output in the console looks something like this:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/7167/api-trace2.png" style="display: block; margin-left: auto; margin-right: auto;"></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('Console API')}}</td> + <td>{{Spec2('Console API')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("api.Console")}}</p> + +<h2 id="Notes">Notes</h2> + +<ul> + <li>At least in Firefox, if a page defines a <code>console</code> object, that object overrides the one built into Firefox.</li> + <li>Prior to {{Gecko("12.0")}}, the console object's methods only work when the Web Console is open. Starting with {{Gecko("12.0")}}, output is cached until the Web Console is opened, then displayed at that time.</li> + <li>It's worth noting that the Firefox's built-in <code>Console</code> object is compatible with the one provided by <a class="external" href="http://getfirebug.com/" title="http://getfirebug.com/">Firebug</a>.</li> +</ul> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Tools" title="Tools">Tools</a></li> + <li><a href="/en-US/docs/Tools/Web_Console" title="Web Console">Web Console</a> — how the Web Console in Firefox handles console API calls</li> + <li><a href="/en-US/docs/Tools/Remote_Debugging">Remote debugging</a> — how to see console output when the debugging target is a mobile device</li> + <li><a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/On-device_console_logging" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/On-device_console_logging">On-device console logging</a> — how to do logging on Firefox OS devices</li> +</ul> + +<h3 id="Other_implementations">Other implementations</h3> + +<ul> + <li><a href="https://developers.google.com/chrome-developer-tools/docs/console-api">Google Chrome DevTools</a></li> + <li><a href="http://getfirebug.com/wiki/index.php/Console_API">Firebug</a></li> + <li><a href="http://msdn.microsoft.com/en-us/library/hh772173(v=vs.85).aspx">Internet Explorer</a></li> + <li><a href="https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/Console/Console.html">Safari</a></li> +</ul> diff --git a/files/he/web/api/console/log/index.html b/files/he/web/api/console/log/index.html new file mode 100644 index 0000000000..8ea8ab6218 --- /dev/null +++ b/files/he/web/api/console/log/index.html @@ -0,0 +1,39 @@ +--- +title: Console.log() +slug: Web/API/Console/log +translation_of: Web/API/Console/log +--- +<div>{{APIRef("Console API")}}</div> + +<p><strong><code>()Console.log</code></strong> - מציגה את פלט ההודעה באזור המסוף של דפדפן האינטרנט.</p> + +<h2 id="תחביר">תחביר</h2> + +<pre class="syntaxbox">console.log(<em>obj1</em> [, <em>obj2</em>, ..., <em>objN</em>]); +console.log(<em>msg</em> [, <em>subst1</em>, ..., <em>substN</em>]); +</pre> + +<h2 id="מפרט">מפרט</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("Console API", "#log", "console.log()")}}</td> + <td>{{Spec2("Console API")}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="תאימות_דפדפן">תאימות דפדפן</h2> + + + +<p>{{Compat("api.Console.log")}}</p> diff --git a/files/he/web/api/document/index.html b/files/he/web/api/document/index.html new file mode 100644 index 0000000000..d380692a64 --- /dev/null +++ b/files/he/web/api/document/index.html @@ -0,0 +1,488 @@ +--- +title: Document +slug: Web/API/Document +tags: + - API + - DOM + - Document + - Interface + - NeedsTranslation + - Reference + - TopicStub +translation_of: Web/API/Document +--- +<p><span class="seoSummary">The <strong><code>Document</code></strong> interface represents any web page loaded in the browser and serves as an entry point into the web page's content, which is the <a href="/en-US/docs/Using_the_W3C_DOM_Level_1_Core" title="Using_the_W3C_DOM_Level_1_Core">DOM tree</a>.</span> The DOM tree includes elements such as {{HTMLElement("body")}} and {{HTMLElement("table")}}, among <a href="/en-US/docs/Web/HTML/Element">many others</a>. It provides functionality globally to the document, like how to obtain the page's URL and create new elements in the document.</p> + +<p>{{inheritanceDiagram}}</p> + +<p>The <code>Document</code> interface describes the common properties and methods for any kind of document. Depending on the document's type (e.g. <a href="/en-US/docs/HTML" title="HTML">HTML</a>, <a href="/en-US/docs/XML" title="XML">XML</a>, SVG, …), a larger API is available: HTML documents, served with the <code>"text/html"</code> content type, also implement the {{domxref("HTMLDocument")}} interface, whereas XML and SVG documents implement the {{domxref("XMLDocument")}} interface.</p> + +<h2 id="Properties" name="Properties">Constructor</h2> + +<dl> + <dt>{{domxref("Document.Document","Document()")}}{{non-standard_inline}}</dt> + <dd>Creates a new <code>Document</code> object.</dd> +</dl> + +<h2 id="Properties" name="Properties">Properties</h2> + +<p><em>This interface also inherits from the {{domxref("Node")}} and {{domxref("EventTarget")}} interfaces.</em></p> + +<dl> + <dt>{{domxref("Document.anchors")}} {{readonlyinline}}</dt> + <dd>Returns a list of all of the anchors in the document.</dd> + <dt>{{domxref("Document.body")}}</dt> + <dd>Returns the {{HTMLElement("body")}} or {{htmlelement("frameset")}} node of the current document.</dd> + <dt>{{domxref("Document.characterSet")}} {{readonlyinline}}</dt> + <dd>Returns the character set being used by the document.</dd> + <dt>{{domxref("Document.compatMode")}} {{readonlyinline}} {{experimental_inline}}</dt> + <dd>Indicates whether the document is rendered in <em>quirks</em> or <em>strict</em> mode.</dd> + <dt>{{domxref("Document.contentType")}} {{readonlyinline}} {{experimental_inline}}</dt> + <dd>Returns the Content-Type from the MIME Header of the current document.</dd> + <dt>{{domxref("Document.doctype")}} {{readonlyinline}}</dt> + <dd>Returns the Document Type Definition (DTD) of the current document.</dd> + <dt>{{domxref("Document.documentElement")}} {{readonlyinline}}</dt> + <dd>Returns the {{domxref("Element")}} that is a direct child of the document. For HTML documents, this is normally the <span class="seoSummary">{{domxref("HTMLElement")}}</span> element.</dd> + <dt>{{domxref("Document.documentURI")}} {{readonlyinline}}</dt> + <dd>Returns the document location as a string.</dd> + <dt>{{domxref("Document.embeds")}} {{readonlyinline}}</dt> + <dd>Returns a list of the embedded {{HTMLElement('embed')}} elements within the current document.</dd> + <dt>{{domxref("Document.fonts")}}</dt> + <dd>Returns the {{domxref("FontFaceSet")}} interface of the current document.</dd> + <dt>{{domxref("Document.forms")}} {{readonlyinline}}</dt> + <dd>Returns a list of the {{HTMLElement("form")}} elements within the current document.</dd> + <dt>{{domxref("Document.head")}} {{readonlyinline}}</dt> + <dd>Returns the {{HTMLElement("head")}} element of the current document.</dd> + <dt>{{domxref("Document.hidden")}} {{readonlyinline}}</dt> + <dd>…</dd> + <dt>{{domxref("Document.images")}} {{readonlyinline}}</dt> + <dd>Returns a list of the images in the current document.</dd> + <dt>{{domxref("Document.implementation")}} {{readonlyinline}}</dt> + <dd>Returns the DOM implementation associated with the current document.</dd> + <dt>{{domxref("Document.lastStyleSheetSet")}} {{readonlyinline}}</dt> + <dd>Returns the name of the style sheet set that was last enabled. Has the value <code>null</code> until the style sheet is changed by setting the value of {{domxref("document.selectedStyleSheetSet","selectedStyleSheetSet")}}.</dd> + <dt>{{domxref("Document.links")}} {{readonlyinline}}</dt> + <dd>Returns a list of all the hyperlinks in the document.</dd> + <dt>{{domxref("Document.mozSyntheticDocument")}} {{non-standard_inline}} {{gecko_minversion_inline("8.0")}}</dt> + <dd>Returns a {{jsxref("Boolean")}} that is <code>true</code> only if this document is synthetic, such as a standalone image, video, audio file, or the like.</dd> + <dt>{{domxref("Document.mozFullScreenElement")}} {{readonlyinline}} {{non-standard_inline}} {{gecko_minversion_inline("9.0")}}</dt> + <dd>The element that's currently in full screen mode for this document.</dd> + <dt>{{domxref("Document.mozFullScreenEnabled")}} {{readonlyinline}} {{non-standard_inline}} {{gecko_minversion_inline("9.0")}}</dt> + <dd><code>true</code> if calling {{domxref("Element.mozRequestFullscreen()")}} would succeed in the current document.</dd> + <dt>{{domxref("Document.plugins")}} {{readonlyinline}}</dt> + <dd>Returns a list of the available plugins.</dd> + <dt>{{domxref("Document.policy")}} {{readonlyinline}}{{experimental_inline}}</dt> + <dd>Returns the {{domxref("Policy")}} interface which provides a simple API for introspecting the feature policies applied to a specific document.</dd> + <dt>{{domxref("Document.preferredStyleSheetSet")}} {{readonlyinline}}</dt> + <dd>Returns the preferred style sheet set as specified by the page author.</dd> + <dt>{{domxref("Document.scripts")}} {{readonlyinline}}</dt> + <dd>Returns all the {{HTMLElement("script")}} elements on the document.</dd> + <dt>{{domxref("Document.scrollingElement")}} {{readonlyinline}}</dt> + <dd>Returns a reference to the {{domxref("Element")}} that scrolls the document.</dd> + <dt>{{domxref("Document.selectedStyleSheetSet")}}</dt> + <dd>Returns which style sheet set is currently in use.</dd> + <dt>{{domxref("Document.styleSheetSets")}} {{readonlyinline}}</dt> + <dd>Returns a list of the style sheet sets available on the document.</dd> + <dt>{{domxref("Document.timeline")}} {{readonlyinline}}</dt> + <dd>…</dd> + <dt>{{domxref("Document.undoManager")}} {{readonlyinline}} {{experimental_inline}}</dt> + <dd>…</dd> + <dt>{{domxref("Document.visibilityState")}} {{readonlyinline}}</dt> + <dd>Returns a <code>string</code> denoting the visibility state of the document. Possible values are <code>visible</code>, <code>hidden</code>, <code>prerender</code>, and <code>unloaded</code>.</dd> +</dl> + +<p>The <code>Document</code> interface is extended with the {{domxref("ParentNode")}} interface:</p> + +<p>{{page("/en-US/docs/Web/API/ParentNode","Properties")}}</p> + +<h3 id="Extensions_for_HTMLDocument">Extensions for HTMLDocument</h3> + +<p><em>The <code>Document</code> interface for HTML documents inherits from the {{domxref("HTMLDocument")}} interface or, since HTML5, is extended for such documents.</em></p> + +<dl> + <dt>{{domxref("Document.cookie")}}</dt> + <dd>Returns a semicolon-separated list of the cookies for that document or sets a single cookie.</dd> + <dt>{{domxref("Document.defaultView")}} {{readonlyinline}}</dt> + <dd>Returns a reference to the window object.</dd> + <dt>{{domxref("Document.designMode")}}</dt> + <dd>Gets/sets the ability to edit the whole document.</dd> + <dt>{{domxref("Document.dir")}} {{readonlyinline}}</dt> + <dd>Gets/sets directionality (rtl/ltr) of the document.</dd> + <dt>{{domxref("Document.domain")}}</dt> + <dd>Gets/sets the domain of the current document.</dd> + <dt>{{domxref("Document.lastModified")}} {{readonlyinline}}</dt> + <dd>Returns the date on which the document was last modified.</dd> + <dt>{{domxref("Document.location")}} {{readonlyinline}}</dt> + <dd>Returns the URI of the current document.</dd> + <dt>{{domxref("Document.readyState")}} {{readonlyinline}} {{gecko_minversion_inline("1.9.2")}}</dt> + <dd>Returns loading status of the document.</dd> + <dt>{{domxref("Document.referrer")}} {{readonlyinline}}</dt> + <dd>Returns the URI of the page that linked to this page.</dd> + <dt>{{domxref("Document.title")}}</dt> + <dd>Sets or gets the title of the current document.</dd> + <dt>{{domxref("Document.URL")}} {{readonlyInline}}</dt> + <dd>Returns the document location as a string.</dd> +</dl> + +<h3 id="Properties_included_from_DocumentOrShadowRoot">Properties included from DocumentOrShadowRoot</h3> + +<p><em>The <code>Document</code> interface includes the following properties defined on the {{domxref("DocumentOrShadowRoot")}} mixin. Note that this is currently only implemented by Chrome; other browsers still implement them directly on the {{domxref("Document")}} interface.</em></p> + +<dl> + <dt>{{domxref("DocumentOrShadowRoot.activeElement")}} {{readonlyInline}}</dt> + <dd>Returns the {{domxref('Element')}} within the shadow tree that has focus.</dd> + <dt>{{domxref("Document.fullscreenElement")}} {{readonlyinline}}</dt> + <dd>The element that's currently in full screen mode for this document.</dd> + <dt>{{domxref("DocumentOrShadowRoot.pointerLockElement")}} {{readonlyinline}} {{experimental_inline}}</dt> + <dd>Returns the element set as the target for mouse events while the pointer is locked. <code>null</code> if lock is pending, pointer is unlocked, or if the target is in another document.</dd> + <dt>{{domxref("DocumentOrShadowRoot.styleSheets")}} {{readonlyInline}}</dt> + <dd>Returns a {{domxref('StyleSheetList')}} of {{domxref('CSSStyleSheet')}} objects for stylesheets explicitly linked into, or embedded in a document.</dd> +</dl> + +<h3 id="Event_handlers" name="Event_handlers">Event handlers</h3> + +<dl> + <dt>{{domxref("Document.onafterscriptexecute")}} {{non-standard_inline}}</dt> + <dd>Represents the event handling code for the {{event("afterscriptexecute")}} event.</dd> + <dt>{{domxref("Document.onbeforescriptexecute")}} {{non-standard_inline}}</dt> + <dd>Represents the event handling code for the {{event("beforescriptexecute")}} event.</dd> + <dt>{{domxref("Document.oncopy")}} {{non-standard_inline}}</dt> + <dd>Represents the event handling code for the {{event("copy")}} event.</dd> + <dt>{{domxref("Document.oncut")}} {{non-standard_inline}}</dt> + <dd>Represents the event handling code for the {{event("cut")}} event.</dd> + <dt>{{domxref("Document.onfullscreenchange")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("fullscreenchange")}} event is raised.</dd> + <dt>{{domxref("Document.onfullscreenerror")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("fullscreenerror")}} event is raised.</dd> + <dt>{{domxref("Document.onpaste")}} {{non-standard_inline}}</dt> + <dd>Represents the event handling code for the {{event("paste")}} event.</dd> + <dt>{{domxref("Document.onpointerlockchange")}} {{experimental_inline}}</dt> + <dd>Represents the event handling code for the {{event("pointerlockchange")}} event.</dd> + <dt>{{domxref("Document.onpointerlockerror")}} {{experimental_inline}}</dt> + <dd>Represents the event handling code for the {{event("pointerlockerror")}} event.</dd> + <dt>{{domxref("Document.onreadystatechange")}} {{gecko_minversion_inline("1.9.2")}}</dt> + <dd>Represents the event handling code for the {{event("readystatechange")}} event.</dd> + <dt>{{domxref("Document.onselectionchange")}} {{experimental_inline}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("selectionchange")}} event is raised.</dd> + <dt>{{domxref("Document.onvisibilitychange")}}</dt> + <dd>Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("visibilitychange")}} event is raised.</dd> + <dt>{{domxref("Document.onwheel")}} {{non-standard_inline}}</dt> + <dd>Represents the event handling code for the {{event("wheel")}} event.</dd> +</dl> + +<p>The <code>Document</code> interface is extended with the {{domxref("GlobalEventHandlers")}} interface:</p> + +<p>{{Page("/en-US/docs/Web/API/GlobalEventHandlers", "Properties")}}</p> + +<h3 id="Deprecated_properties">Deprecated properties</h3> + +<dl> + <dt>{{domxref("Document.alinkColor")}} {{Deprecated_inline}}</dt> + <dd>Returns or sets the color of active links in the document body.</dd> + <dt>{{domxref("Document.all")}} {{Deprecated_inline}} {{non-standard_inline}}</dt> + <dd>Provides access to all elements in the document. This is a legacy, non-standard property and should not be used.</dd> + <dt>{{domxref("Document.applets")}} {{Deprecated_inline}} {{readonlyinline}}</dt> + <dd>Returns an ordered list of the applets within a document.</dd> + <dt>{{domxref("Document.async")}} {{Deprecated_inline}}</dt> + <dd>Used with {{domxref("Document.load")}} to indicate an asynchronous request.</dd> + <dt>{{domxref("Document.bgColor")}} {{Deprecated_inline}}</dt> + <dd>Gets/sets the background color of the current document.</dd> + <dt>{{domxref("Document.charset")}} {{readonlyinline}} {{Deprecated_inline}}</dt> + <dd>Alias of {{domxref("Document.characterSet")}}. Use this property instead.</dd> + <dt>{{domxref("Document.domConfig")}} {{Deprecated_inline}}</dt> + <dd>Should return a {{domxref("DOMConfiguration")}} object.</dd> + <dt>{{domxref("document.fgColor")}} {{Deprecated_inline}}</dt> + <dd>Gets/sets the foreground color, or text color, of the current document.</dd> + <dt>{{domxref("Document.fullscreen")}} {{obsolete_inline}}</dt> + <dd><code>true</code> when the document is in {{domxref("Using_full-screen_mode","full-screen mode")}}.</dd> + <dt>{{domxref("Document.height")}} {{non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Gets/sets the height of the current document.</dd> + <dt>{{domxref("Document.inputEncoding")}} {{readonlyinline}} {{Deprecated_inline}}</dt> + <dd>Alias of {{domxref("Document.characterSet")}}. Use this property instead.</dd> + <dt>{{domxref("Document.linkColor")}} {{Deprecated_inline}}</dt> + <dd>Gets/sets the color of hyperlinks in the document.</dd> + <dt>{{domxref("Document.vlinkColor")}} {{Deprecated_inline}}</dt> + <dd>Gets/sets the color of visited hyperlinks.</dd> + <dt>{{domxref("Document.width")}} {{non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Returns the width of the current document.</dd> + <dt>{{domxref("Document.xmlEncoding")}} {{Deprecated_inline}}</dt> + <dd>Returns the encoding as determined by the XML declaration.</dd> + <dt>{{domxref("Document.xmlStandalone")}} {{obsolete_inline("10.0")}}</dt> + <dd>Returns <code>true</code> if the XML declaration specifies the document to be standalone (<em>e.g.,</em> An external part of the DTD affects the document's content), else <code>false</code>.</dd> + <dt>{{domxref("Document.xmlVersion")}} {{obsolete_inline("10.0")}}</dt> + <dd>Returns the version number as specified in the XML declaration or <code>"1.0"</code> if the declaration is absent.</dd> +</dl> + +<h2 id="Methods" name="Methods">Methods</h2> + +<p><em>This interface also inherits from the {{domxref("Node")}} and {{domxref("EventTarget")}} interfaces.</em></p> + +<dl> + <dt>{{domxref("Document.adoptNode()")}}</dt> + <dd>Adopt node from an external document.</dd> + <dt>{{domxref("Document.captureEvents()")}} {{Deprecated_inline}}</dt> + <dd>See {{domxref("Window.captureEvents")}}.</dd> + <dt>{{domxref("Document.caretRangeFromPoint()")}}{{non-standard_inline}}</dt> + <dd>Gets a {{Domxref("Range")}} object for the document fragment under the specified coordinates.</dd> + <dt>{{domxref("Document.createAttribute()")}}</dt> + <dd>Creates a new {{domxref("Attr")}} object and returns it.</dd> + <dt>{{domxref("Document.createAttributeNS()")}}</dt> + <dd>Creates a new attribute node in a given namespace and returns it.</dd> + <dt>{{domxref("Document.createCDATASection()")}}</dt> + <dd>Creates a new CDATA node and returns it.</dd> + <dt>{{domxref("Document.createComment()")}}</dt> + <dd>Creates a new comment node and returns it.</dd> + <dt>{{domxref("Document.createDocumentFragment()")}}</dt> + <dd>Creates a new document fragment.</dd> + <dt>{{domxref("Document.createElement()")}}</dt> + <dd>Creates a new element with the given tag name.</dd> + <dt>{{domxref("Document.createElementNS()")}}</dt> + <dd>Creates a new element with the given tag name and namespace URI.</dd> + <dt>{{domxref("Document.createEntityReference()")}} {{obsolete_inline}}</dt> + <dd>Creates a new entity reference object and returns it.</dd> + <dt>{{domxref("Document.createEvent()")}}</dt> + <dd>Creates an event object.</dd> + <dt>{{domxref("Document.createNodeIterator()")}}</dt> + <dd>Creates a {{domxref("NodeIterator")}} object.</dd> + <dt>{{domxref("Document.createProcessingInstruction()")}}</dt> + <dd>Creates a new {{domxref("ProcessingInstruction")}} object.</dd> + <dt>{{domxref("Document.createRange()")}}</dt> + <dd>Creates a {{domxref("Range")}} object.</dd> + <dt>{{domxref("Document.createTextNode()")}}</dt> + <dd>Creates a text node.</dd> + <dt>{{domxref("Document.createTouch()")}} {{Deprecated_inline}}</dt> + <dd>Creates a {{domxref("Touch")}} object.</dd> + <dt>{{domxref("Document.createTouchList()")}}</dt> + <dd>Creates a {{domxref("TouchList")}} object.</dd> + <dt>{{domxref("Document.createTreeWalker()")}}</dt> + <dd>Creates a {{domxref("TreeWalker")}} object.</dd> + <dt>{{domxref("Document.enableStyleSheetsForSet()")}}</dt> + <dd>Enables the style sheets for the specified style sheet set.</dd> + <dt>{{domxref("Document.exitPointerLock()")}} {{experimental_inline}}</dt> + <dd>Release the pointer lock.</dd> + <dt>{{domxref("Document.getAnimations()")}} {{experimental_inline}}</dt> + <dd>Returns an array of all {{domxref("Animation")}} objects currently in effect, whose target elements are descendants of the <code>document</code>.</dd> + <dt>{{domxref("Document.getElementsByClassName()")}}</dt> + <dd>Returns a list of elements with the given class name.</dd> + <dt>{{domxref("Document.getElementsByTagName()")}}</dt> + <dd>Returns a list of elements with the given tag name.</dd> + <dt>{{domxref("Document.getElementsByTagNameNS()")}}</dt> + <dd>Returns a list of elements with the given tag name and namespace.</dd> + <dt>{{domxref("Document.importNode()")}}</dt> + <dd>Returns a clone of a node from an external document.</dd> + <dt>{{domxref("Document.normalizeDocument()")}} {{obsolete_inline}}</dt> + <dd>Replaces entities, normalizes text nodes, etc.</dd> + <dt>{{domxref("Document.releaseCapture()")}} {{non-standard_inline}} {{gecko_minversion_inline("2.0")}}</dt> + <dd>Releases the current mouse capture if it's on an element in this document.</dd> + <dt>{{domxref("Document.releaseEvents()")}} {{non-standard_inline}} {{Deprecated_inline}}</dt> + <dd>See {{domxref("Window.releaseEvents()")}}.</dd> + <dt>{{domxref("Document.routeEvent()")}} {{non-standard_inline}} {{obsolete_inline(24)}}</dt> + <dd>See {{domxref("Window.routeEvent()")}}.</dd> + <dt>{{domxref("Document.mozSetImageElement()")}} {{non-standard_inline}} {{gecko_minversion_inline("2.0")}}</dt> + <dd>Allows you to change the element being used as the background image for a specified element ID.</dd> +</dl> + +<p>The <code>Document</code> interface is extended with the {{domxref("ParentNode")}} interface:</p> + +<dl> + <dt>{{domxref("document.getElementById","document.getElementById(String id)")}}</dt> + <dd>Returns an object reference to the identified element.</dd> + <dt>{{domxref("document.querySelector","document.querySelector(String selector)")}} {{gecko_minversion_inline("1.9.1")}}</dt> + <dd>Returns the first Element node within the document, in document order, that matches the specified selectors.</dd> + <dt>{{domxref("document.querySelectorAll","document.querySelectorAll(String selector)")}} {{gecko_minversion_inline("1.9.1")}}</dt> + <dd>Returns a list of all the Element nodes within the document that match the specified selectors.</dd> +</dl> + +<p>The <code>Document</code> interface is extended with the {{domxref("XPathEvaluator")}} interface:</p> + +<dl> + <dt>{{domxref("document.createExpression","document.createExpression(String expression, XPathNSResolver resolver)")}}</dt> + <dd>Compiles an <code><a href="/en-US/docs/XPathExpression" title="XPathExpression">XPathExpression</a></code> which can then be used for (repeated) evaluations.</dd> + <dt>{{domxref("document.createNSResolver","document.createNSResolver(Node resolver)")}}</dt> + <dd>Creates an {{domxref("XPathNSResolver")}} object.</dd> + <dt>{{domxref("document.evaluate","document.evaluate(String expression, Node contextNode, XPathNSResolver resolver, Number type, Object result)")}}</dt> + <dd>Evaluates an XPath expression.</dd> +</dl> + +<h3 id="Extension_for_HTML_documents">Extension for HTML documents</h3> + +<p>The <code>Document</code> interface for HTML documents inherit from the {{domxref("HTMLDocument")}} interface or, since HTML5, is extended for such documents:</p> + +<dl> + <dt>{{domxref("document.clear()")}} {{non-standard_inline}} {{Deprecated_inline}}</dt> + <dd>In majority of modern browsers, including recent versions of Firefox and Internet Explorer, this method does nothing.</dd> + <dt>{{domxref("document.close()")}}</dt> + <dd>Closes a document stream for writing.</dd> + <dt>{{domxref("document.execCommand","document.execCommand(String command[, Boolean showUI[, String value]])")}}</dt> + <dd>On an editable document, executes a formating command.</dd> + <dt>{{domxref("document.getElementsByName","document.getElementsByName(String name)")}}</dt> + <dd>Returns a list of elements with the given name.</dd> + <dt>{{domxref("document.hasFocus()")}}</dt> + <dd>Returns <code>true</code> if the focus is currently located anywhere inside the specified document.</dd> + <dt>{{domxref("document.open()")}}</dt> + <dd>Opens a document stream for writing.</dd> + <dt>{{domxref("document.queryCommandEnabled","document.queryCommandEnabled(String command)")}}</dt> + <dd>Returns true if the formating command can be executed on the current range.</dd> + <dt>{{domxref("document.queryCommandIndeterm","document.queryCommandIndeterm(String command)")}}</dt> + <dd>Returns true if the formating command is in an indeterminate state on the current range.</dd> + <dt>{{domxref("document.queryCommandState","document.queryCommandState(String command)")}}</dt> + <dd>Returns true if the formating command has been executed on the current range.</dd> + <dt>{{domxref("document.queryCommandSupported","document.queryCommandSupported(String command)")}}</dt> + <dd>Returns true if the formating command is supported on the current range.</dd> + <dt>{{domxref("document.queryCommandValue","document.queryCommandValue(String command)")}}</dt> + <dd>Returns the current value of the current range for a formating command.</dd> + <dt>{{domxref("document.write","document.write(String text)")}}</dt> + <dd>Writes text in a document.</dd> + <dt>{{domxref("document.writeln","document.writeln(String text)")}}</dt> + <dd>Writes a line of text in a document.</dd> +</dl> + +<h3 id="Methods_included_from_DocumentOrShadowRoot">Methods included from DocumentOrShadowRoot</h3> + +<p><em>The <code>Document</code> interface includes the following methods defined on the {{domxref("DocumentOrShadowRoot")}} mixin. Note that this is currently only implemented by Chrome; other browsers still implement them on the {{domxref("Document")}} interface.</em></p> + +<dl> + <dt>{{domxref("DocumentOrShadowRoot.getSelection()")}}</dt> + <dd>Returns a {{domxref('Selection')}} object representing the range of text selected by the user, or the current position of the caret.</dd> + <dt>{{domxref("DocumentOrShadowRoot.elementFromPoint()")}}</dt> + <dd>Returns the topmost element at the specified coordinates.</dd> + <dt>{{domxref("DocumentOrShadowRoot.elementsFromPoint()")}}</dt> + <dd>Returns an array of all elements at the specified coordinates.</dd> + <dt>{{domxref("DocumentOrShadowRoot.caretPositionFromPoint()")}}</dt> + <dd>Returns a {{domxref('CaretPosition')}} object containing the DOM node containing the caret, and caret's character offset within that node.</dd> +</dl> + +<h2 id="Non-standard_extensions_non-standard_inline">Non-standard extensions {{non-standard_inline}}</h2> + +<div>{{non-standard_header}}</div> + +<h3 id="Firefox_notes">Firefox notes</h3> + +<p>Mozilla defines a set of non-standard properties made only for XUL content:</p> + +<dl> + <dt>{{domxref("document.currentScript")}} {{non-standard_inline}} {{gecko_minversion_inline("2.0")}}</dt> + <dd>Returns the {{HTMLElement("script")}} element that is currently executing.</dd> + <dt>{{domxref("document.documentURIObject")}} {{gecko_minversion_inline("1.9")}}</dt> + <dd>(<strong>Mozilla add-ons only!</strong>) Returns the {{Interface("nsIURI")}} object representing the URI of the document. This property only has special meaning in privileged JavaScript code (with UniversalXPConnect privileges).</dd> + <dt>{{domxref("document.popupNode")}}</dt> + <dd>Returns the node upon which a popup was invoked.</dd> + <dt>{{domxref("document.tooltipNode")}}</dt> + <dd>Returns the node which is the target of the current tooltip.</dd> +</dl> + +<p>Mozilla also define some non-standard methods:</p> + +<dl> + <dt>{{domxref("document.execCommandShowHelp")}} {{obsolete_inline("14.0")}}</dt> + <dd>This method never did anything and always threw an exception, so it was removed in Gecko 14.0 {{geckoRelease("14.0")}}.</dd> + <dt>{{domxref("document.getBoxObjectFor")}} {{obsolete_inline}}</dt> + <dd>Use the {{domxref("Element.getBoundingClientRect()")}} method instead.</dd> + <dt>{{domxref("document.loadOverlay")}} {{Fx_minversion_inline("1.5")}}</dt> + <dd>Loads a <a href="/en-US/docs/XUL_Overlays" title="XUL_Overlays">XUL overlay</a> dynamically. This only works in XUL documents.</dd> + <dt>{{domxref("document.queryCommandText")}} {{obsolete_inline("14.0")}}</dt> + <dd>This method never did anything but throw an exception, and was removed in Gecko 14.0 {{geckoRelease("14.0")}}.</dd> +</dl> + +<h3 id="Internet_Explorer_notes">Internet Explorer notes</h3> + +<p>Microsoft defines some non-standard properties:</p> + +<dl> + <dt>{{domxref("document.fileSize")}}* {{non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Returns size in bytes of the document. Starting with Internet Explorer 11, that property is no longer supported. See <a href="http://msdn.microsoft.com/en-us/library/ms533752%28v=VS.85%29.aspx" title="http://msdn.microsoft.com/en-us/library/ms533752%28v=VS.85%29.aspx">MSDN</a>.</dd> +</dl> + +<p>Internet Explorer does not support all methods from the <code>Node</code> interface in the <code>Document</code> interface:</p> + +<dl> + <dt>{{domxref("document.contains")}}</dt> + <dd>As a work-around, <code>document.body.contains()</code> can be used.</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("DOM WHATWG", "#interface-document", "Document")}}</td> + <td>{{Spec2("DOM WHATWG")}}</td> + <td>Intend to supersede DOM 3</td> + </tr> + <tr> + <td>{{SpecName("HTML WHATWG", "dom.html#the-document-object", "Document")}}</td> + <td>{{Spec2("HTML WHATWG")}}</td> + <td>Turn the {{domxref("HTMLDocument")}} interface into a <code>Document</code> extension.</td> + </tr> + <tr> + <td>{{SpecName("HTML Editing", "#dom-document-getselection", "Document")}}</td> + <td>{{Spec2("HTML Editing")}}</td> + <td>Extend the <code>Document</code> interface</td> + </tr> + <tr> + <td>{{SpecName("CSSOM View", "#extensions-to-the-document-interface", "Document")}}</td> + <td>{{Spec2("CSSOM View")}}</td> + <td>Extend the <code>Document</code> interface</td> + </tr> + <tr> + <td>{{SpecName("CSSOM", "#extensions-to-the-document-interface", "Document")}}</td> + <td>{{Spec2("CSSOM")}}</td> + <td>Extend the <code>Document</code> interface</td> + </tr> + <tr> + <td>{{SpecName("Pointer Lock", "#extensions-to-the-document-interface", "Document")}}</td> + <td>{{Spec2("Pointer Lock")}}</td> + <td>Extend the <code>Document</code> interface</td> + </tr> + <tr> + <td>{{SpecName("Page Visibility API", "#extensions-to-the-document-interface", "Document")}}</td> + <td>{{Spec2("Page Visibility API")}}</td> + <td>Extend the <code>Document</code> interface with the <code>visibilityState</code> and <code>hidden</code> attributes and the <code>onvisibilitychange</code> event listener.</td> + </tr> + <tr> + <td>{{SpecName("Selection API", "#extensions-to-document-interface", "Document")}}</td> + <td>{{Spec2("Selection API")}}</td> + <td>Adds <code>getSelection()</code>, <code>onselectstart</code> and <code>onselectionchange</code>.</td> + </tr> + <tr> + <td>{{SpecName("DOM4", "#interface-document", "Document")}}</td> + <td>{{Spec2("DOM4")}}</td> + <td>Supersede DOM 3</td> + </tr> + <tr> + <td>{{SpecName("DOM3 Core", "#i-Document", "Document")}}</td> + <td>{{Spec2("DOM3 Core")}}</td> + <td>Supersede DOM 2</td> + </tr> + <tr> + <td>{{SpecName("DOM3 XPath", "xpath.html#XPathEvaluator", "XPathEvaluator")}}</td> + <td>{{Spec2("DOM3 XPath")}}</td> + <td>Define the {{domxref("XPathEvaluator")}} interface which extend document.</td> + </tr> + <tr> + <td>{{SpecName("DOM2 Core", "#i-Document", "Document")}}</td> + <td>{{Spec2("DOM2 Core")}}</td> + <td>Supersede DOM 1</td> + </tr> + <tr> + <td>{{SpecName("DOM1", "#i-Document", "Document")}}</td> + <td>{{Spec2("DOM1")}}</td> + <td>Initial definition for the interface</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("api.Document")}}</p> + +<div>{{APIRef}}</div> diff --git a/files/he/web/api/document/write/index.html b/files/he/web/api/document/write/index.html new file mode 100644 index 0000000000..8c497d548c --- /dev/null +++ b/files/he/web/api/document/write/index.html @@ -0,0 +1,82 @@ +--- +title: 'Document.write():' +slug: Web/API/Document/write +translation_of: Web/API/Document/write +--- +<div>{{ ApiRef("DOM") }}</div> + +<p><strong><code>()Document.write</code></strong> - כותב מחרוזת טקסט אל גוף מסמך HTML.</p> + +<h2 id="תחביר">תחביר</h2> + +<pre class="brush: js">document.write(<em>markup</em>); +</pre> + +<h3 id="פרמטרים">פרמטרים</h3> + +<dl> + <dt><code>markup</code></dt> + <dd>מחרוזת המכילה את הטקסט שיופיע במסמך.</dd> +</dl> + +<h3 id="דוגמה">דוגמה</h3> + +<pre class="brush: html"><html> + +<head> + <title>write example</title> + + <script> + function newContent() { + alert("load new content"); + document.open(); + document.write("<h1>Out with the old - in with the new!</h1>"); + document.close(); + } + </script> +</head> + +<body onload="newContent();"> + <p>Some original document content.</p> +</body> + +</html> + +</pre> + +<h2 id="מפרט">מפרט</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("HTML WHATWG", "#dom-document-write", "document.write(...)")}}</td> + <td>{{Spec2("HTML WHATWG")}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName("DOM2 HTML", "html.html#ID-75233634", "document.write(...)")}}</td> + <td>{{Spec2("DOM2 HTML")}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="תאימות_דפדפן">תאימות דפדפן</h2> + + + +<p>{{Compat("api.Document.write")}}</p> + +<h2 id="ראה_גם">ראה גם</h2> + +<ul> + <li>{{ domxref("element.innerHTML") }}</li> + <li>{{ domxref("document.createElement()") }}</li> +</ul> diff --git a/files/he/web/api/domstring/index.html b/files/he/web/api/domstring/index.html new file mode 100644 index 0000000000..210e3c86c0 --- /dev/null +++ b/files/he/web/api/domstring/index.html @@ -0,0 +1,50 @@ +--- +title: DOMString +slug: Web/API/DOMString +translation_of: Web/API/DOMString +--- +<p>{{APIRef("DOM")}}<br> + מחרוזת <strong><code>DOMString</code></strong> הינה מחרוזות מסוג UTF-16.<br> + כל מחרוזת בשפת JavaScript נחשבת למחרוזת UTF-16 ולכן, נחשבת ל-<code><strong>DOMString</strong></code> באופן אוטומטי.</p> + +<h2 id="Specification" name="Specification">מפרט</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('WebIDL', '#idl-DOMString', 'DOMString')}}</td> + <td>{{Spec2('WebIDL')}}</td> + <td>Rephrasing of the definition to remove weird edge cases.</td> + </tr> + <tr> + <td>{{SpecName('DOM3 Core', 'core.html#DOMString', 'DOMString')}}</td> + <td>{{Spec2('DOM3 Core')}}</td> + <td>No change from {{SpecName('DOM2 Core')}}</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Core', 'core.html#ID-C74D1578', 'DOMString')}}</td> + <td>{{Spec2('DOM2 Core')}}</td> + <td>No change from {{SpecName('DOM1')}}</td> + </tr> + <tr> + <td>{{SpecName('DOM1', 'level-one-core.html#ID-C74D1578', 'DOMString')}}</td> + <td>{{Spec2('DOM1')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="ראו_גם">ראו גם </h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String" title="/en-US/docs/Web/API/DOMString">String</a></li> + <li>{{domxref("USVString")}}</li> + <li>{{domxref("CSSOMString")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/String_view" title="/en-US/docs/Web/JavaScript/Typed_arrays/String_view"><code>StringView</code> – a C-like representation of strings based on typed arrays</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/DOMString/Binary">Binary strings</a></li> +</ul> diff --git a/files/he/web/api/element/index.html b/files/he/web/api/element/index.html new file mode 100644 index 0000000000..a0d4f8ee21 --- /dev/null +++ b/files/he/web/api/element/index.html @@ -0,0 +1,331 @@ +--- +title: Element +slug: Web/API/Element +tags: + - API + - DOM + - DOM Reference + - Element + - Interface + - NeedsTranslation + - Reference + - TopicStub + - Web API +translation_of: Web/API/Element +--- +<div>{{APIRef("DOM")}}</div> + +<p><span class="seoSummary"><strong><code>Element</code></strong> is the most general base class from which all objects in a {{DOMxRef("Document")}} inherit. It only has methods and properties common to all kinds of elements. More specific classes inherit from <code>Element</code>.</span> For example, the {{DOMxRef("HTMLElement")}} interface is the base interface for HTML elements, while the {{DOMxRef("SVGElement")}} interface is the basis for all SVG elements. Most functionality is specified further down the class hierarchy.</p> + +<p>Languages outside the realm of the Web platform, like XUL through the <code>XULElement</code> interface, also implement <code>Element</code>.</p> + +<p>{{InheritanceDiagram}}</p> + +<h2 id="Properties" name="Properties">Properties</h2> + +<p><em>Inherits properties from its parent interface, {{DOMxRef("Node")}}, and by extension that interface's parent, {{DOMxRef("EventTarget")}}. It implements the properties of {{DOMxRef("ParentNode")}}, {{DOMxRef("ChildNode")}}, {{DOMxRef("NonDocumentTypeChildNode")}}, </em>and {{DOMxRef("Animatable")}}.</p> + +<dl> + <dt>{{DOMxRef("Element.attributes")}} {{readOnlyInline}}</dt> + <dd>Returns a {{DOMxRef("NamedNodeMap")}} object containing the assigned attributes of the corresponding HTML element.</dd> + <dt>{{DOMxRef("Element.classList")}} {{readOnlyInline}}</dt> + <dd>Returns a {{DOMxRef("DOMTokenList")}} containing the list of class attributes.</dd> + <dt>{{DOMxRef("Element.className")}}</dt> + <dd>Is a {{DOMxRef("DOMString")}} representing the class of the element.</dd> + <dt>{{DOMxRef("Element.clientHeight")}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the inner height of the element.</dd> + <dt>{{DOMxRef("Element.clientLeft")}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the width of the left border of the element.</dd> + <dt>{{DOMxRef("Element.clientTop")}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the width of the top border of the element.</dd> + <dt>{{DOMxRef("Element.clientWidth")}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the inner width of the element.</dd> + <dt>{{DOMxRef("Element.computedName")}} {{readOnlyInline}}</dt> + <dd>Returns a {{DOMxRef("DOMString")}} containing the label exposed to accessibility.</dd> + <dt>{{DOMxRef("Element.computedRole")}} {{readOnlyInline}}</dt> + <dd>Returns a {{DOMxRef("DOMString")}} containing the ARIA role that has been applied to a particular element. </dd> + <dt>{{DOMxRef("Element.id")}}</dt> + <dd>Is a {{DOMxRef("DOMString")}} representing the id of the element.</dd> + <dt>{{DOMxRef("Element.innerHTML")}}</dt> + <dd>Is a {{DOMxRef("DOMString")}} representing the markup of the element's content.</dd> + <dt>{{DOMxRef("Element.localName")}} {{readOnlyInline}}</dt> + <dd>A {{DOMxRef("DOMString")}} representing the local part of the qualified name of the element.</dd> + <dt>{{DOMxRef("Element.namespaceURI")}} {{readonlyInline}}</dt> + <dd>The namespace URI of the element, or <code>null</code> if it is no namespace. + <div class="note"> + <p><strong>Note:</strong> In Firefox 3.5 and earlier, HTML elements are in no namespace. In later versions, HTML elements are in the <code><a class="linkification-ext external" href="http://www.w3.org/1999/xhtml" title="Linkification: http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a></code> namespace in both HTML and XML trees. {{ gecko_minversion_inline("1.9.2")}}</p> + </div> + </dd> + <dt>{{DOMxRef("NonDocumentTypeChildNode.nextElementSibling")}} {{readOnlyInline}}</dt> + <dd>Is an {{DOMxRef("Element")}}, the element immediately following the given one in the tree, or <code>null</code> if there's no sibling node.</dd> + <dt>{{DOMxRef("Element.outerHTML")}}</dt> + <dd>Is a {{DOMxRef("DOMString")}} representing the markup of the element including its content. When used as a setter, replaces the element with nodes parsed from the given string.</dd> + <dt>{{DOMxRef("Element.prefix")}} {{readOnlyInline}}</dt> + <dd>A {{DOMxRef("DOMString")}} representing the namespace prefix of the element, or <code>null</code> if no prefix is specified.</dd> + <dt>{{DOMxRef("NonDocumentTypeChildNode.previousElementSibling")}} {{readOnlyInline}}</dt> + <dd>Is a {{DOMxRef("Element")}}, the element immediately preceding the given one in the tree, or <code>null</code> if there is no sibling element.</dd> + <dt>{{DOMxRef("Element.scrollHeight")}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the scroll view height of an element.</dd> + <dt>{{DOMxRef("Element.scrollLeft")}}</dt> + <dd>Is a {{jsxref("Number")}} representing the left scroll offset of the element.</dd> + <dt>{{DOMxRef("Element.scrollLeftMax")}} {{Non-standard_Inline}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the maximum left scroll offset possible for the element.</dd> + <dt>{{DOMxRef("Element.scrollTop")}}</dt> + <dd>A {{jsxref("Number")}} representing number of pixels the top of the document is scrolled vertically.</dd> + <dt>{{DOMxRef("Element.scrollTopMax")}} {{Non-standard_Inline}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the maximum top scroll offset possible for the element.</dd> + <dt>{{DOMxRef("Element.scrollWidth")}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the scroll view width of the element.</dd> + <dt>{{DOMxRef("Element.shadowRoot")}}{{readOnlyInline}}</dt> + <dd>Returns the open shadow root that is hosted by the element, or null if no open shadow root is present.</dd> + <dt>{{DOMxRef("Element.openOrClosedShadowRoot")}} {{Non-standard_Inline}}{{readOnlyInline}}</dt> + <dd>Returns the shadow root that is hosted by the element, regardless if its open or closed. <strong>Available only to <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions">WebExtensions</a>.</strong></dd> + <dt>{{DOMxRef("Element.slot")}} {{Experimental_Inline}}</dt> + <dd>Returns the name of the shadow DOM slot the element is inserted in.</dd> + <dt>{{DOMxRef("Element.tabStop")}} {{Non-standard_Inline}}</dt> + <dd>Is a {{jsxref("Boolean")}} indicating if the element can receive input focus via the tab key.</dd> + <dt>{{DOMxRef("Element.tagName")}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("String")}} with the name of the tag for the given element.</dd> + <dt>{{DOMxRef("Element.undoManager")}} {{Experimental_Inline}} {{readOnlyInline}}</dt> + <dd>Returns the {{DOMxRef("UndoManager")}} associated with the element.</dd> + <dt>{{DOMxRef("Element.undoScope")}} {{Experimental_Inline}}</dt> + <dd>Is a {{jsxref("Boolean")}} indicating if the element is an undo scope host, or not.</dd> +</dl> + +<div class="note"> +<p><strong>Note:</strong> DOM Level 3 defined <code>namespaceURI</code>, <code>localName</code> and <code>prefix</code> on the {{DOMxRef("Node")}} interface. In DOM4 they were moved to <code>Element</code>.</p> + +<p>This change is implemented in Chrome since version 46.0 and Firefox since version 48.0.</p> +</div> + +<h3 id="Properties_included_from_Slotable">Properties included from Slotable</h3> + +<p><em>The <code>Element</code> interface includes the following property, defined on the {{DOMxRef("Slotable")}} mixin.</em></p> + +<dl> + <dt>{{DOMxRef("Slotable.assignedSlot")}}{{readonlyInline}}</dt> + <dd>Returns a {{DOMxRef("HTMLSlotElement")}} representing the {{htmlelement("slot")}} the node is inserted in.</dd> +</dl> + +<h3 id="Handlers" name="Handlers">Event handlers</h3> + +<dl> + <dt>{{domxref("Element.onfullscreenchange")}}</dt> + <dd>An event handler for the {{event("fullscreenchange")}} event, which is sent when the element enters or exits full-screen mode. This can be used to watch both for successful expected transitions, but also to watch for unexpected changes, such as when your app is backgrounded.</dd> + <dt>{{domxref("Element.onfullscreenerror")}}</dt> + <dd>An event handler for the {{event("fullscreenerror")}} event, which is sent when an error occurs while attempting to change into full-screen mode.</dd> +</dl> + +<h4 id="Obsolete_event_handlers">Obsolete event handlers</h4> + +<dl> + <dt>{{DOMxRef("Element.onwheel")}}</dt> + <dd>Returns the event handling code for the {{Event("wheel")}} event. <strong>This is now implemented on {{DOMxRef("GlobalEventHandlers.onwheel", "GlobalEventHandlers")}}.</strong></dd> +</dl> + +<h2 id="Methods" name="Methods">Methods</h2> + +<p><em>Inherits methods from its parents {{DOMxRef("Node")}}, and its own parent, {{DOMxRef("EventTarget")}}<em>, and implements those of {{DOMxRef("ParentNode")}}, {{DOMxRef("ChildNode")}}<em>, {{DOMxRef("NonDocumentTypeChildNode")}}, </em></em>and {{DOMxRef("Animatable")}}.</em></p> + +<dl> + <dt>{{DOMxRef("EventTarget.addEventListener()")}}</dt> + <dd>Registers an event handler to a specific event type on the element.</dd> + <dt>{{DOMxRef("Element.attachShadow()")}}</dt> + <dd>Attatches a shadow DOM tree to the specified element and returns a reference to its {{DOMxRef("ShadowRoot")}}.</dd> + <dt>{{DOMxRef("Element.animate()")}} {{Experimental_Inline}}</dt> + <dd>A shortcut method to create and run an animation on an element. Returns the created Animation object instance.</dd> + <dt>{{DOMxRef("Element.closest()")}} {{Experimental_Inline}}</dt> + <dd>Returns the {{DOMxRef("Element")}} which is the closest ancestor of the current element (or the current element itself) which matches the selectors given in parameter.</dd> + <dt>{{DOMxRef("Element.createShadowRoot()")}} {{Non-standard_Inline}} {{Deprecated_Inline}}</dt> + <dd>Creates a <a href="/en-US/docs/Web/Web_Components/Shadow_DOM">shadow DOM</a> on on the element, turning it into a shadow host. Returns a {{DOMxRef("ShadowRoot")}}.</dd> + <dt>{{DOMxRef("Element.computedStyleMap()")}} {{Experimental_Inline}}</dt> + <dd>Returns a {{DOMxRef("StylePropertyMapReadOnly")}} interface which provides a read-only representation of a CSS declaration block that is an alternative to {{DOMxRef("CSSStyleDeclaration")}}.</dd> + <dt>{{DOMxRef("EventTarget.dispatchEvent()")}}</dt> + <dd>Dispatches an event to this node in the DOM and returns a {{jsxref("Boolean")}} that indicates whether no handler canceled the event.</dd> + <dt>{{DOMxRef("Element.getAnimations()")}} {{Experimental_Inline}}</dt> + <dd>Returns an array of Animation objects currently active on the element.</dd> + <dt>{{DOMxRef("Element.getAttribute()")}}</dt> + <dd>Retrieves the value of the named attribute from the current node and returns it as an {{jsxref("Object")}}.</dd> + <dt>{{DOMxRef("Element.getAttributeNames()")}}</dt> + <dd>Returns an array of attribute names from the current element.</dd> + <dt>{{DOMxRef("Element.getAttributeNS()")}}</dt> + <dd>Retrieves the value of the attribute with the specified name and namespace, from the current node and returns it as an {{jsxref("Object")}}.</dd> + <dt>{{DOMxRef("Element.getAttributeNode()")}} {{Obsolete_Inline}}</dt> + <dd>Retrieves the node representation of the named attribute from the current node and returns it as an {{DOMxRef("Attr")}}.</dd> + <dt>{{DOMxRef("Element.getAttributeNodeNS()")}} {{Obsolete_Inline}}</dt> + <dd>Retrieves the node representation of the attribute with the specified name and namespace, from the current node and returns it as an {{DOMxRef("Attr")}}.</dd> + <dt>{{DOMxRef("Element.getBoundingClientRect()")}}</dt> + <dd>Returns the size of an element and its position relative to the viewport.</dd> + <dt>{{DOMxRef("Element.getClientRects()")}}</dt> + <dd>Returns a collection of rectangles that indicate the bounding rectangles for each line of text in a client.</dd> + <dt>{{DOMxRef("Element.getElementsByClassName()")}}</dt> + <dd>Returns a live {{DOMxRef("HTMLCollection")}} that contains all descendants of the current element that possess the list of classes given in the parameter.</dd> + <dt>{{DOMxRef("Element.getElementsByTagName()")}}</dt> + <dd>Returns a live {{DOMxRef("HTMLCollection")}} containing all descendant elements, of a particular tag name, from the current element.</dd> + <dt>{{DOMxRef("Element.getElementsByTagNameNS()")}}</dt> + <dd>Returns a live {{DOMxRef("HTMLCollection")}} containing all descendant elements, of a particular tag name and namespace, from the current element.</dd> + <dt>{{DOMxRef("Element.hasAttribute()")}}</dt> + <dd>Returns a {{jsxref("Boolean")}} indicating if the element has the specified attribute or not.</dd> + <dt>{{DOMxRef("Element.hasAttributeNS()")}}</dt> + <dd>Returns a {{jsxref("Boolean")}} indicating if the element has the specified attribute, in the specified namespace, or not.</dd> + <dt>{{DOMxRef("Element.hasAttributes()")}}</dt> + <dd>Returns a {{jsxref("Boolean")}} indicating if the element has one or more HTML attributes present.</dd> + <dt>{{DOMxRef("Element.hasPointerCapture()")}}</dt> + <dd>Indicates whether the element on which it is invoked has pointer capture for the pointer identified by the given pointer ID.</dd> + <dt>{{DOMxRef("Element.insertAdjacentElement()")}}</dt> + <dd>Inserts a given element node at a given position relative to the element it is invoked upon.</dd> + <dt>{{DOMxRef("Element.insertAdjacentHTML()")}}</dt> + <dd>Parses the text as HTML or XML and inserts the resulting nodes into the tree in the position given.</dd> + <dt>{{DOMxRef("Element.insertAdjacentText()")}}</dt> + <dd>Inserts a given text node at a given position relative to the element it is invoked upon.</dd> + <dt>{{DOMxRef("Element.matches()")}} {{Experimental_Inline}}</dt> + <dd>Returns a {{jsxref("Boolean")}} indicating whether or not the element would be selected by the specified selector string.</dd> + <dt>{{DOMxRef("Element.querySelector()")}}</dt> + <dd>Returns the first {{DOMxRef("Node")}} which matches the specified selector string relative to the element.</dd> + <dt>{{DOMxRef("Element.querySelectorAll()")}}</dt> + <dd>Returns a {{DOMxRef("NodeList")}} of nodes which match the specified selector string relative to the element.</dd> + <dt>{{DOMxRef("Element.releasePointerCapture()")}}</dt> + <dd>Releases (stops) pointer capture that was previously set for a specific {{DOMxRef("PointerEvent","pointer event")}}.</dd> + <dt>{{DOMxRef("ChildNode.remove()")}} {{Experimental_Inline}}</dt> + <dd>Removes the element from the children list of its parent.</dd> + <dt>{{DOMxRef("Element.removeAttribute()")}}</dt> + <dd>Removes the named attribute from the current node.</dd> + <dt>{{DOMxRef("Element.removeAttributeNS()")}}</dt> + <dd>Removes the attribute with the specified name and namespace, from the current node.</dd> + <dt>{{DOMxRef("Element.removeAttributeNode()")}} {{Obsolete_Inline}}</dt> + <dd>Removes the node representation of the named attribute from the current node.</dd> + <dt>{{DOMxRef("EventTarget.removeEventListener()")}}</dt> + <dd>Removes an event listener from the element.</dd> + <dt>{{DOMxRef("Element.requestFullscreen()")}} {{Experimental_Inline}}</dt> + <dd>Asynchronously asks the browser to make the element full-screen.</dd> + <dt>{{DOMxRef("Element.requestPointerLock()")}} {{Experimental_Inline}}</dt> + <dd>Allows to asynchronously ask for the pointer to be locked on the given element.</dd> +</dl> + +<dl> + <dt>{{domxref("Element.scroll()")}}</dt> + <dd>Scrolls to a particular set of coordinates inside a given element.</dd> + <dt>{{domxref("Element.scrollBy()")}}</dt> + <dd>Scrolls an element by the given amount.</dd> + <dt>{{DOMxRef("Element.scrollIntoView()")}} {{Experimental_Inline}}</dt> + <dd>Scrolls the page until the element gets into the view.</dd> + <dt>{{domxref("Element.scrollTo()")}}</dt> + <dd>Scrolls to a particular set of coordinates inside a given element.</dd> + <dt>{{DOMxRef("Element.setAttribute()")}}</dt> + <dd>Sets the value of a named attribute of the current node.</dd> + <dt>{{DOMxRef("Element.setAttributeNS()")}}</dt> + <dd>Sets the value of the attribute with the specified name and namespace, from the current node.</dd> + <dt>{{DOMxRef("Element.setAttributeNode()")}} {{Obsolete_Inline}}</dt> + <dd>Sets the node representation of the named attribute from the current node.</dd> + <dt>{{DOMxRef("Element.setAttributeNodeNS()")}} {{Obsolete_Inline}}</dt> + <dd>Sets the node representation of the attribute with the specified name and namespace, from the current node.</dd> + <dt>{{DOMxRef("Element.setCapture()")}} {{Non-standard_Inline}}</dt> + <dd>Sets up mouse event capture, redirecting all mouse events to this element.</dd> + <dt>{{DOMxRef("Element.setPointerCapture()")}}</dt> + <dd>Designates a specific element as the capture target of future <a href="/en-US/docs/Web/API/Pointer_events">pointer events</a>.</dd> + <dt>{{DOMxRef("Element.toggleAttribute()")}}</dt> + <dd>Toggles a boolean attribute, removing it if it is present and adding it if it is not present, on the specified element.</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("Web Animations", '', '')}}</td> + <td>{{Spec2("Web Animations")}}</td> + <td>Added the <code>getAnimations()</code> method.</td> + </tr> + <tr> + <td>{{SpecName('Undo Manager', '', 'Element')}}</td> + <td>{{Spec2('Undo Manager')}}</td> + <td>Added the <code>undoScope</code> and <code>undoManager</code> properties.</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2', '#extensions-to-the-element-interface', 'Element')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>Added the following event handlers: <code>ongotpointercapture</code> and <code>onlostpointercapture</code>.<br> + Added the following methods: <code>setPointerCapture()</code> and <code>releasePointerCapture()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#extensions-to-the-element-interface', 'Element')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>Added the following event handlers: <code>ongotpointercapture</code> and <code>onlostpointercapture</code>.<br> + Added the following methods: <code>setPointerCapture()</code> and <code>releasePointerCapture()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Selectors API Level 1', '#interface-definitions', 'Element')}}</td> + <td>{{Spec2('Selectors API Level 1')}}</td> + <td>Added the following methods: <code>querySelector()</code> and <code>querySelectorAll()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Pointer Lock', 'index.html#element-interface', 'Element')}}</td> + <td>{{Spec2('Pointer Lock')}}</td> + <td>Added the <code>requestPointerLock()</code> method.</td> + </tr> + <tr> + <td>{{SpecName('Fullscreen', '#api', 'Element')}}</td> + <td>{{Spec2('Fullscreen')}}</td> + <td>Added the <code>requestFullscreen()</code> method.</td> + </tr> + <tr> + <td>{{SpecName('DOM Parsing', '#extensions-to-the-element-interface', 'Element')}}</td> + <td>{{Spec2('DOM Parsing')}}</td> + <td>Added the following properties: <code>innerHTML</code>, and <code>outerHTML</code>.<br> + Added the following method: <code>insertAdjacentHTML()</code>.</td> + </tr> + <tr> + <td>{{SpecName('CSSOM View', '#extensions-to-the-element-interface', 'Element')}}</td> + <td>{{Spec2('CSSOM View')}}</td> + <td>Added the following properties: <code>scrollTop</code>, <code>scrollLeft</code>, <code>scrollWidth</code>, <code>scrollHeight</code>, <code>clientTop</code>, <code>clientLeft</code>, <code>clientWidth</code>, and <code>clientHeight</code>.<br> + Added the following methods: <code>getClientRects()</code>, <code>getBoundingClientRect()</code>, <code>scroll()</code>, <code>scrollBy()</code>, <code>scrollTo()</code> and <code>scrollIntoView()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Element Traversal', '#ecmascript-bindings', 'Element')}}</td> + <td>{{Spec2('Element Traversal')}}</td> + <td>Added inheritance of the {{DOMxRef("ElementTraversal")}} interface.</td> + </tr> + <tr> + <td>{{SpecName('DOM WHATWG', '#interface-element', 'Element')}}</td> + <td>{{Spec2('DOM WHATWG')}}</td> + <td>Added the following methods: <code>closest()</code>, <code>insertAdjacentElement()</code> and <code>insertAdjacentText()</code>.<br> + Moved <code>hasAttributes()</code> from the <code>Node</code> interface to this one.</td> + </tr> + <tr> + <td>{{SpecName("DOM4", "#interface-element", "Element")}}</td> + <td>{{Spec2("DOM4")}}</td> + <td>Removed the following methods: <code>setIdAttribute()</code>, <code>setIdAttributeNS()</code>, and <code>setIdAttributeNode()</code>.<br> + Modified the return value of <code>getElementsByTagName()</code> and <code>getElementsByTagNameNS()</code>.<br> + Removed the <code>schemaTypeInfo</code> property.</td> + </tr> + <tr> + <td>{{SpecName('DOM3 Core', 'core.html#ID-745549614', 'Element')}}</td> + <td>{{Spec2('DOM3 Core')}}</td> + <td>Added the following methods: <code>setIdAttribute()</code>, <code>setIdAttributeNS()</code>, and <code>setIdAttributeNode()</code>. These methods were never implemented and have been removed in later specifications.<br> + Added the <code>schemaTypeInfo</code> property. This property was never implemented and has been removed in later specifications.</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Core', 'core.html#ID-745549614', 'Element')}}</td> + <td>{{Spec2('DOM2 Core')}}</td> + <td>The <code>normalize()</code> method has been moved to {{DOMxRef("Node")}}.</td> + </tr> + <tr> + <td>{{SpecName('DOM1', 'level-one-core.html#ID-745549614', 'Element')}}</td> + <td>{{Spec2('DOM1')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("api.Element")}}</p> diff --git a/files/he/web/api/geolocation/index.html b/files/he/web/api/geolocation/index.html new file mode 100644 index 0000000000..e69c21503d --- /dev/null +++ b/files/he/web/api/geolocation/index.html @@ -0,0 +1,109 @@ +--- +title: Geolocation +slug: Web/API/Geolocation +tags: + - API + - Advanced + - Geolocation API + - Interface + - NeedsTranslation + - Reference + - TopicStub +translation_of: Web/API/Geolocation +--- +<div> + {{APIRef}}</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 offer customized results based on the user's location.</p> +<p>An object with this interface is obtained using the {{domxref("NavigatorGeolocation.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 inherit 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()")}}</dt> + <dd> + Determines the device's current location and gives back a {{domxref("Position")}} object with the data.</dd> + <dt> + {{domxref("Geolocation.watchPosition()")}}</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()")}}</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>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>5</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> + </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>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>{{CompatGeckoMobile("4")}}</td> + <td>{{CompatUnknown()}}</td> + <td>10.60</td> + <td>{{CompatUnknown()}}</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/he/web/api/geolocation/ממשק_שירותי_מיקום/index.html b/files/he/web/api/geolocation/ממשק_שירותי_מיקום/index.html new file mode 100644 index 0000000000..f87dbb0f0b --- /dev/null +++ b/files/he/web/api/geolocation/ממשק_שירותי_מיקום/index.html @@ -0,0 +1,250 @@ +--- +title: ממשק שירותי מיקום +slug: Web/API/Geolocation/ממשק_שירותי_מיקום +translation_of: Web/API/Geolocation_API +--- +<p style="direction: rtl;">ממשק שירותי המיקום, geolocation API, מאפשר למשתמש לשתף את המיקום שלו עם אפליקציות ברשת. כדי להגן על הפרטיות, המשתמש נדרש להסכים לשתף את שירותי המיקום שלו.</p> +<p style="direction: rtl;"><span style="font-size: 2.142857142857143rem; font-weight: 700; letter-spacing: -1px; line-height: 30px;">אובייקט ה- geolocation </span></p> +<p style="direction: rtl;">ממשק שירותי המיקום נגיש באמצעות אובייקט:<span style="line-height: 1.5;">{{domxref("window.navigator.geolocation","navigator.geolocation")}} .</span></p> +<p style="direction: rtl;">אם האובייקט קיים, ממשק שירותי המיקום נתמך: ניתן לבדוק אם ממשק שירותי המיקום נתמך באמצעות: </p> +<pre class="brush: js">if ("geolocation" in navigator) { + /* הממשק נתמך*/ +} else { + /* הממשק אינו נתמך */ +}הערה +</pre> +<div class="note"> + <p style="direction: rtl;"><strong>הערה:</strong> מגרסה מס' 24 של FireFox ומטה, הפקודה geolocation" in navigator" מחזירה true אפילו אם הממשק אינו נתמך. באג זה תוקן ב<a href="/en-US/docs/Mozilla/Firefox/Releases/25/Site_Compatibility">גרסה 25 של FireFox</a> על מנת לעמוד בתקן. ({{bug(884921)}}).</p> +</div> +<h3 id="קבלת_המיקום_הנוכחי" style="direction: rtl;">קבלת המיקום הנוכחי</h3> +<p dir="rtl">כדי לקבל את נתוני המיקום הנוכחי של המשתמש, ניתן לקרוא לפונקציה: <span style="line-height: 1.5;"> {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}. הפונקציה יוצרת קריאה אסינכרונית על מנת לאחזר את המיקום של המשתמש ובודקת את החומרה על מנת לקבל את המיקום העדכני ביותר. כאשר נתוני המיקום חוזרים כתוצאה מהקריאה, פונקציית המטרה (באנגלית: callback) נקראת. אפשר להעביר לקריאה פרמטר נוסף, פרמטר שני: פונקציית מטרה לטיפול במיקרה של שגיאה. אפשר להעביר פרמטר שלישי לקריאה: אובייקט options שבו אפשר להגדיר מהו הוותק המכסימלי לערכי המיקום המוחזרים, משך הזמן המכסימלי להמתנה עד שנתוני המיקום יתקבלו ורמת הדיוק של נתוני המיקום. </span></p> +<div class="note"> + <p style="direction: rtl;"><strong>הערה</strong>: כברירת מחדל, הפונקציה<span style="line-height: 1.5;">, {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}} מנסה להחזיר את נתוני המיקום במהירות האפשרית, אך ברמת דיוק מינימלית. צורה זו שימושית אם רוצים לקבל את הנתונים במהירות הגבוהה האפשרית תוך התפשרות על רמת הדיוק. במכשירים עם מנגנון GPS משך הזמן לקבלת נתונים יכול לקחת דקה ויותר, לכן הפונקציה </span><span style="line-height: 1.5;"> {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}} יכולה לקבל בחזרה נתונים שיש בהם מידה מסוימת של שגיאה (אם המיקום חושב על בסיס כתובת IP על בסיס מיקום נקודת wifi).</span></p> +</div> +<pre class="brush: js">navigator.geolocation.getCurrentPosition(function(position) { + do_something(position.coords.latitude, position.coords.longitude); +});</pre> +<p style="direction: rtl;">הקוד בדוגמא שלעיל יגרום לפונקצייה, ()do_something, להתבצע כאשר נתוני המיקום חזרו.</p> +<p> </p> +<p style="direction: rtl;"><span style="font-size: 1.714285714285714rem; letter-spacing: -0.5px; line-height: 24px;">מעקב אחר המיקום הנוכחי</span></p> +<p style="direction: rtl;"><span style="line-height: 1.5;">אם נתוני המיקום משתנים (בגלל שהדפדפן נמצא בתנועה, או אם הגיעו נתוני מיקום מדוייקים יותר), אפשר להגדיר פונקציית מטרה (באנגלית: callback), המקבלת נתוני מיקום מעודכנים יותר. עושים זאת באמצעות הפונקציה: </span><span style="line-height: 1.5;">{{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} שיש לה את אותם פרמטרים כמו הפונקציה: </span><span style="line-height: 1.5;"> {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}. פונקציית המטרה מתבצעת מס' כלשהו של פעמים ומאפשרת לדפדפן לעדכן את המיקום של המשתמש תוך כדי תנועה, או לעדכן את מיקומו בנתונים מעודכנים יותר שהגיעו על ידי טכניקות זיהוי מיקום מדוייקות יותר. ניתן להגדיר פונקציית מטרה נוספת למקרה של שגיאה שתיקרא בכל פעם שתתרחש שגיאה כפי שקורה במיקרה של: </span><span style="line-height: 1.5;"> {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}.</span></p> +<div class="note"> + <p style="direction: rtl;"><strong>הערה</strong>: ניתן להשתמש בפונקציה: <span style="line-height: 1.5;">{{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} מבלי צורך לקרוא לפני כן לפונקציה: {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}} .</span></p> +</div> +<pre class="brush: js">var watchID = navigator.geolocation.watchPosition(function(position) { + do_something(position.coords.latitude, position.coords.longitude); +});</pre> +<p style="direction: rtl;">הפונקציה <span style="line-height: 1.5;">{{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} מחזירה id שמזהה את הפונקציה שעוקבת אחר המיקום. ניתן לאחר מכן להשתמש בו כדי לקרוא לפונקציה </span><span style="line-height: 1.5;"> {{domxref("window.navigator.geolocation.clearWatch()","clearWatch()")}} על מנת להפסיק את פעולת המעקב אחרי תנועת המשתמש.</span></p> +<pre class="brush: js">navigator.geolocation.clearWatch(watchID); +</pre> +<h3 id="כיול_התוצאות" style="direction: rtl;">כיול התוצאות</h3> +<p style="direction: rtl;">הן הפונקציה {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}} והן הפונקציה {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} מקבלות פרמטר פונקציית מטרה למקרה הצלחה בקבלת נתונים, מקבלות פרמטר אופציונאלי למקרה של שגיאה בקבלת נתוני מיקום ופרמטר אופציונאלי שלישי: אובייקט <span style="line-height: 1.5;"> </span><code style="font-style: normal; line-height: 1.5;">PositionOptions</code><span style="line-height: 1.5;">.</span></p> +<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","PositionOptions")}}</p> +<p style="direction: rtl;">קריאה ל: {{domxref("window.navigator.geolocation.watchPosition()","watchPosition")}} יכולה להיראות כך:</p> +<pre class="brush: js">function geo_success(position) { + do_something(position.coords.latitude, position.coords.longitude); +} + +function geo_error() { + alert("Sorry, no position available."); +} + +var geo_options = { + enableHighAccuracy: true, + maximumAge : 30000, + timeout : 27000 +}; + +var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);</pre> +<p><a id="fck_paste_padding">A demo of watchPosition in use: </a><a class="external" href="http://www.thedotproduct.org/experiments/geo/">http://www.thedotproduct.org/experiments/geo/</a><br> + <a id="fck_paste_padding"></a></p> +<h2 id="נתוני_המיקום" style="direction: rtl;">נתוני המיקום</h2> +<p style="direction: rtl;">המיקום של המשתמש הוא אובייקט <code>Position</code> שמכיל בתוכו אובייקט <code>Coordinates</code>.</p> +<p><span style="line-height: 1.5;">{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","Position")}}</span></p> +<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","Coordinates")}}</p> +<h2 id="טיפול_בשגיאות" style="direction: rtl;">טיפול בשגיאות</h2> +<p style="direction: rtl;"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">פונקציית המטרה לטיפול בשגיאות נגישה גם בקריאה לפונקציה ()</span><code><span style="font-size: 14px; line-height: 1.5;"><font face="Courier New, Andale Mono, monospace">getCurrentPosition</font></span></code><span style="line-height: 1.5;"><code> </code>וגם בקריאה ל ()<code>watchPosition</code><strong><code>, </code></strong></span>ומקבלת כפרמטר ראשון אובייקט <code>PositionError</code>. </p> +<pre class="brush: js">function errorCallback(error) { + alert('ERROR(' + error.code + '): ' + error.message); +}; +</pre> +<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","PositionError")}}</p> +<h2 id="דוגמא_שלמה_לממשק_שירותי_מיקום" style="direction: rtl;">דוגמא שלמה לממשק שירותי מיקום</h2> +<div class="hidden"> + <pre class="brush: css">body { + padding: 20px; + background-color:#ffffc9 +} + +p { margin : 0; } +</pre> +</div> +<h3 id="HTML" style="direction: rtl;">HTML: </h3> +<pre class="brush: html;"><p><button onclick="geoFindMe()">Show my location</button></p> +<div id="out"></div> +</pre> +<h3 id="JavaScript" style="direction: rtl;">JavaScript:</h3> +<pre class="brush: js;">function geoFindMe() { + var output = document.getElementById("out"); + + if (!navigator.geolocation){ + output.innerHTML = "<p>Geolocation is not supported by your browser</p>"; + return; + } + + function success(position) { + var latitude = position.coords.latitude; + var longitude = position.coords.longitude; + + output.innerHTML = '<p>Latitude is ' + latitude + '° <br>Longitude is ' + longitude + '°</p>'; + + var img = new Image(); + img.src = "http://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false"; + + output.appendChild(img); + }; + + function error() { + output.innerHTML = "Unable to retrieve your location"; + }; + + output.innerHTML = "<p>Locating…</p>"; + + navigator.geolocation.getCurrentPosition(success, error); +} +</pre> +<h3 id="תוצאות_של_הדוגמא_לעיל" style="direction: rtl;">תוצאות של הדוגמא לעיל:</h3> +<p>{{ EmbedLiveSample('Geolocation_Live_Example',350,410) }}</p> +<h2 id="הצגת_הודעה_לבקשת_רשות" style="direction: rtl;">הצגת הודעה לבקשת רשות</h2> +<p style="direction: rtl;">כל תוסף המשתייך ל addons.mozilla.org המשתמש בממשק שירותי המיקום חייב לקבל אישור מהמשתמש לגשת לממשק על ידי בקשת רשות מפורשת. הפונקציה הבאה תבקש אישור באופן שזהה לבקשת האישור המוצגת לדפים ברשת. הבחירה של המשתמש תישמר בהעדפות באמצעות פרמטר <code>pref </code>או הוא מאופשר. הפונקציה המוצבעת על ידי פרמטר <code>callback </code>תיקרא עם פרמטר בוליאני המציין את בחירת המשתמש. אם הערך <code>true </code>יש לתוסף הרשאה לגשת לנתוני המיקום. </p> +<pre class="brush: js">function prompt(window, pref, message, callback) { + let branch = Components.classes["@mozilla.org/preferences-service;1"] + .getService(Components.interfaces.nsIPrefBranch); + + if (branch.getPrefType(pref) === branch.PREF_STRING) { + switch (branch.getCharPref(pref)) { + case "always": + return callback(true); + case "never": + return callback(false); + } + } + + let done = false; + + function remember(value, result) { + return function() { + done = true; + branch.setCharPref(pref, value); + callback(result); + } + } + + let self = window.PopupNotifications.show( + window.gBrowser.selectedBrowser, + "geolocation", + message, + "geo-notification-icon", + { + label: "Share Location", + accessKey: "S", + callback: function(notification) { + done = true; + callback(true); + } + }, [ + { + label: "Always Share", + accessKey: "A", + callback: remember("always", true) + }, + { + label: "Never Share", + accessKey: "N", + callback: remember("never", false) + } + ], { + eventCallback: function(event) { + if (event === "dismissed") { + if (!done) callback(false); + done = true; + window.PopupNotifications.remove(self); + } + }, + persistWhileVisible: true + }); +} + +prompt(window, + "extensions.foo-addon.allowGeolocation", + "Foo Add-on wants to know your location.", + function callback(allowed) { alert(allowed); }); +</pre> +<h2 id="תאימות_דפדפנים">תאימות דפדפנים</h2> +<div> + {{ CompatibilityTable() }}</div> +<div> + </div> +<div id="compat-desktop"> + <table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</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>{{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> + </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>Firefox Mobile (Gecko)</th> + <th>Firefox OS</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>{{CompatGeckoMobile("4")}}</td> + <td>1.0.1</td> + <td>{{CompatUnknown()}}</td> + <td>10.60<br> + Removed in 15.0<br> + Reintroduced in 16.0</td> + <td>{{CompatUnknown()}}</td> + </tr> + </tbody> + </table> +</div> +<h3 id="הערות_לגבי_Gecko" style="direction: rtl;">הערות לגבי Gecko</h3> +<p style="direction: rtl;">דפדפן FireFox תומך בקבלת נתוני המיקום בהתבסס על מידע WiFi באמצעות שירותי המיקום של גוגל. בטרנזאקציה שבין FireFox ל Google, המידע שמועבר כולל מידע על נקודת הגישה ל WiFi, כולל access token (שדומה לcookie בעלת תוקף למשך שבועיים) וכולל את כתובת ה IP של המשתמש. למידע נוסף יש התעדכן ב<a href="http://www.mozilla.com/en-US/legal/privacy/">תנאי הפרטיות</a> של Mozilla וב<a href="http://www.google.com/privacy-lsf.html">תנאי הפרטיות</a> של גוגל המפרטים באיזה אופן נתונים אלה ניתנים לשימוש. </p> +<p style="direction: rtl;">FireFox גרסת 3.6 (Gecko 1.9.2) הוסיף תמיכה לשימוש בשירות GPSD (GPS daemon) בשביל שירותי מיקום עבור Linux. </p> +<p style="direction: rtl;"><span style="font-size: 2.142857142857143rem; font-weight: 700; letter-spacing: -1px; line-height: 30px;">לעיון נוסף</span></p> +<ul> + <li>{{domxref("window.navigator.geolocation","navigator.geolocation")}}</li> + <li><a href="/en-US/Apps/Build/gather_and_modify_data/Plotting_yourself_on_the_map">צייר את עצמך על המפה</a></li> + <li><a href="http://www.w3.org/TR/geolocation-API/">ממשק שירותי המיקום ב:w3.org</a></li> + <li><a href="/en-US/demos/tag/tech:geolocation">דוגמאות לשימוש במשק נתוני המיקום</a></li> + <li><a href="https://hacks.mozilla.org/2013/10/who-moved-my-geolocation/">Who moved my geolocation?</a> (Hacks blog)</li> +</ul> diff --git a/files/he/web/api/index.html b/files/he/web/api/index.html new file mode 100644 index 0000000000..83cde65af8 --- /dev/null +++ b/files/he/web/api/index.html @@ -0,0 +1,38 @@ +--- +title: Web API Interfaces +slug: Web/API +tags: + - API + - Apps + - JavaScript + - Landing + - Reference + - Web + - WebAPI +translation_of: Web/API +--- +<p dir="rtl">כשאתה כותב קוד עבור ה-Web, יש הרבה Web APIs זמינים. להלן רשימה של כל ה-APIs והממשקים (טיפוסי עצמים) בהם תוכל להשתמש בעת פיתוח אפליקציית ה-Web או האתר שלך.</p> + +<div dir="rtl">בדרך כלל משתמשים ב-Web APIs עם JavaScript, אם כי זה לא תמיד חייב להיות כך.</div> + +<div dir="rtl"></div> + +<h2 dir="rtl" id="מפרטים">מפרטים</h2> + +<p dir="rtl">זו רשימת כל ה-APIs הזמינים.</p> + +<p dir="rtl">{{ListGroups}}</p> + +<h2 dir="rtl" id="ממשקים">ממשקים</h2> + +<p dir="rtl">זו רשימת כל הממשקים (זאת אומרת, טיפוסים של עצמים) הזמינים.</p> + +<p dir="rtl">{{APIListAlpha}}</p> + +<h2 dir="rtl" id="ראה_גם">ראה גם</h2> + + + +<ul dir="rtl"> + <li><a href="/he/docs/Web/Events">התייחסות לאירועי Web API</a></li> +</ul> diff --git a/files/he/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html b/files/he/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html new file mode 100644 index 0000000000..094ee01378 --- /dev/null +++ b/files/he/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html @@ -0,0 +1,141 @@ +--- +title: מגבלות האחסנה של הדפדפן וקריטריונים לפינוי +slug: Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria +tags: + - Database + - IndexedDB + - LRU + - אחסנה + - בדיס נתונים + - מגבלה + - פינוי + - צד הלקוח +translation_of: Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria +--- +<div>{{DefaultAPISidebar("IndexedDB")}}</div> + +<div>קיימות מספר טכנולוגיות רשת המאחסנות נתונים מסוג זה או אחר בצד הלקוח (כלומר, על הדיסק המקומי שלך). התהליך בו הדפדפן מחשב כמה מקום להקצות לאחסנת מידע רשת ומה למחוק כאשר מגיעים לגבול אינו פשוט, ונבדל בין דפדפנים.</div> + +<div>מאמר זה מתאר איך דפדפנים מכריעים איזה תוכן מקומי לטהר, ומתי בסדר לשחרר חלל אחסנה מקומי.</div> + +<p class="summary"></p> + +<div class="note"> +<p><strong>לתשומת לבך</strong>: המידע שלהלן אמור להיות מדוייק במידה מספקת עבור רוב הדפדפנים המודרניים, אך פרטי דפדפן נקראים כאשר ידועים. אופרה וכרום צריכים לפעול באותה דרך בכל המקרים, <a href="http://www.opera.com/mobile/mini">Opera Mini</a> (תצוגת צד שרת, שעדיין מבוסס על תגובה מהירה) אינו מאחסן כל נתונים שהם בצד הלדוח.</p> +</div> + +<h2 id="אלו_טכנולוגיות_משתמשות_באחסנת_הנתונים_של_הדפדפן">אלו טכנולוגיות משתמשות באחסנת הנתונים של הדפדפן?</h2> + +<p>בפיירפוקס, הטכנולוגיות הבאות עושות שימוש באחסנת הנתונים של הדפדפן לאחסן נתונים כאשר יש צורך. הגדרנו עבורם את המושג "לקוחות מכסה" בהקשר זה:</p> + +<ul> + <li><a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a></li> + <li>שמירת <a href="http://asmjs.org/">asm.js</a> במטמון</li> + <li><a href="/en-US/docs/Web/API/Cache">Cache API</a></li> + <li>עוגיות</li> +</ul> + +<div class="note"> +<p><strong>לתשומת לבך</strong>: בפיירפוקס, <a href="/en-US/docs/Web/API/Web_Storage_API">אחסנת הרשת</a> בקרוב תתחיל להשתמש גם היא באותם כלי ניהול שטחי אחסון , כמתואר במסמך זה.</p> +</div> + +<div class="note"> +<p><strong>לתשומת לבך</strong>: במצב גלישה פרטית, רוב אחסנת המידע אינה נתמכת. נתוני אחסון מקומיים ועוגיות עדיין מאוחסנים, אך הם ארעיים - הנתונים נמחקים כאשר סוגרים את חלון אך הם ארעיים — הנתונים נמחקים עם סגירת חלון הגלישה הפרטית האחרון.</p> +</div> + +<p>"זמן הגישה האחרון" של מקורות מתעדכן כאשר כל אחד מאלה מופעל/מושבת — פינוי מקורות ימח' נתונים עבור כל לקוחות המכסה.</p> + +<p>בכרום/אופרה, ממשק פיתוח היישומים של ניהול המכסות מטפל בניהול עבור <a href="/en-US/docs/Web/HTML/Using_the_application_cache">AppCache</a>, <a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a>, WebSQL, ו-<a href="/en-US/docs/Web/API/File_System_API">File System API</a>.</p> + +<h2 id="טיפוסים_שונים_של_אחסנת_נתונים">טיפוסים שונים של אחסנת נתונים</h2> + +<p>גם באותו הדפדפן, שימוש באותה שיטת אחסון, קיינות מחלקות שונות של אחסנת נתונים להבין. פרק זה ידון במפר מהם שייתכן ויימצאו בדפדפנים שונים.</p> + +<p>אחסנה מופיעה במספר טיפוסים:</p> + +<ul> + <li>קבועה : אלה הנתונים שבכוונתנו לשמור בהישג יד לטווח רחוק. הם יפונו אך ורק על פי בחירת המשתמש/ת (לדוגמה, בפיירפוקס תוכלו לבחור למחוק את כל הנתונים המאוחסנים ממקורות נבחרים על ידי גישה ל"העדפות" ושימוש באפשרויות תחת <em>"פרטיות ואבטחה-> עוגיות ונתוני אתרים"</em>).</li> + <li>זמנית: אלו נתונים שאינם צריכים להישמר לזמן רב כל כך. הם יפונו תחת מדיניות השימוש המאוחר ביותר ({{anch("LRU policy")}}) כאשר כמות הנתונים תגיע ל- {{anch("מגבלות האחסנה")}}.</li> +</ul> + +<p>בפיירפוקס, כשאשר נעשה שימוש באחסנה קבועה,, ניתן למשתמש/ת חלון ממשק משתמש קופץ להתריע לו/ה כי הנתונים יישמרו, ובחלון תישאל השאלה אם המשתמש/ת מסכים/ה לכך. אחסנת נתונים זמנית אינה מעוררת כל פנייה למשתמש/ת.</p> + +<p>כברירת מחדל האחסנה היא זמנית; מפתחים יכולים לבחור להשתמש באחסנה קבועה לאתרים שלהם באמצעות השיטה {{domxref("StorageManager.persist()")}} הזמינה ב-<a href="/en-US/docs/Web/API/Storage_API">Storage API</a>.</p> + +<h2 id="היכן_מאוחסנים_הנתונים">היכן מאוחסנים הנתונים?</h2> + +<p>כל טיפוס אחסנה מייצג מאגר נפרד. להלן המיפוי האקטואלי ל,תיקיות תחת פרופיל הפיירפוקס של המשתמש/ת (דפדפנים אחרים עשויים להיות מעט שונים):</p> + +<ul> + <li><code><profile>/storage</code> — התיקייה הראשית של הרמה הגבוהה ביותר לאחסון מתוחזקת על ידי מנהל המכסות (ראו להלן)</li> + <li><code><profile>/storage/permanent</code> — תיקיית מאגר הנתונים הקבועים</li> + <li><code><profile>/storage/temporary</code> — תיקיית מאגר הנתונים הזמניים</li> + <li><code><profile>/storage/default</code> — מאגר ברירת המחדל של הנתונים</li> +</ul> + +<div> +<div class="note"> +<p><strong>לתשומת לבך</strong>: אחרי שהוצג ה <a href="/en-US/docs/Web/API/Storage_API">Storage API</a>, התיקייה "permanent" יכולה להיחשב מיושנת; התיקייה "permanent" מאחסנת רק את בסיסי הנתונים מהטיפוס הקבוע IndexedDB. לא משנה אם מצב התיבה הוא "best-effort" או "persistent" — נתונים נשמרים תחת <profile>/storage/default.</p> +</div> +</div> + +<div class="note"> +<p><strong>לתשומת לבך</strong>: בפיירפוקס , ניתן למצוא את תיקיית הפרופיל שלך על ידי הכנסת <code>about:support</code> בשורת ה- URL , ולחיצה על הכפתור פתיחת ספרייה (למשל <em>Show ב- Finder</em> על Mac OS X) על יד הכותרת <em>Profile Folder</em> .</p> +</div> + +<div class="note"> +<p><strong>לתשומת לבך</strong>: אם תחפשו במידע השמור בתיקיית הפרופיל , ייתכן שתמצאו תיקייה רביעית:: <code>persistent</code>. בעיקרות, שמה של התיקייה <code>persistent</code> שונה ל-<code>permanent</code> בשלב מסויים בעבר כדי ששדרוגים/מעברים יהיו פשוטים לביצוע.</p> +</div> + +<div class="note"> +<p><strong>לתשומת לבך</strong>: אל למשתמשים להוסיף תיקיות וקבצים משלהם תחת <code><profile>/storage</code>. זה יגרום לאתחולי אחסנה להיכשל; לדוגמא, {{domxref("IDBFactory.open()", "open()")}} יגרום לאירוע שגיאה.</p> +</div> + +<h2 id="מגבלות_האחסנה">מגבלות האחסנה</h2> + +<p>שטח האחסנה המירבי של הדפדפן הוא דינמי — הוא מבוסס על גודל הדיסק הקשיח. <strong>הגבול הגלובלי</strong> מחושב כ-50% מהשטח הפנוי על הדיסק. בפיירפוקס, כלי פנימי של הדפדפן הקרוי Quota Manager כוקב אחרי גודל חלל הדיסק שכל מקור מנצל עד תום, ומוחק נתונים אם יש צורך בכך.</p> + +<p>כך שאם נפח הדיסק הקשיח שלך הוא 500 ג"ב, אזי שטח האחסון לדפדפן הינו 250 ג"ב. במקרה של חריגה, מופעל תהליך בשם <strong>origin eviction</strong>, המוחק את כל שווי הנתונים של המקור עד שכמות הנתונים המאוחסנת חוזרת אל מתחת לגבול. אין כל אפקט של קיצוץ הבא למחוק חלקים של מקורות — מחיקת בסיס נתונים של מקור עלולה ליצור בעיות של חוסר עקביות.</p> + +<p>קיים גם גבול הקרוי <strong>group limit</strong> — הוא מוגדר כ- 20% מהגבול הגלובלי, אך יש לו מינימום של 10 מ"ב ומקסימום של 2 ג"ב. כל מקור הוא חלק מקבוצה (קבוצת מקורות). קיימת קבוצה לכל דומיין eTLD+1. לדוגמה:</p> + +<ul> + <li><code>mozilla.org</code> — group1, origin1</li> + <li><code>www.mozilla.org</code> — group1, origin2</li> + <li><code>joe.blogs.mozilla.org</code> — group1, origin3</li> + <li><code>firefox.com</code> — group2, origin4</li> +</ul> + +<p>בקבוצה זו, <code>mozilla.org</code>, <code>www.mozilla.org</code>, ו-<code>joe.blogs.mozilla.org</code> יכולים במצטבר להשתמש במקסימום 20% מהגבול הגלובלי. <code>ל- firefox.com</code> יש מקסימום בנפרד של 20%.</p> + +<p>שני הגבולות מגיבים בצורה שונה כשמגיעים לגבול:</p> + +<ul> + <li>לגבול הקבוצתי קוראים גם "גבול קשה": הוא אינו גורם לפינוי מקורות.</li> + <li>הגבול הגלובלי הוא "גבול רך" מכיוון שאין סיכוי ששטח כלשהו ישוחרר והפעולה יכולה להימשך,</li> +</ul> + +<div class="note"> +<p><strong>לתשומת לבך</strong>: הגבול הקבוצתי אינו יכול להיות יותר מהגבול הגלובלי, , למרות מינימום הגבול הקבוצתי הנזכר לעיל . אם הינך במצב של מעט זיכרון באמת כשנניח שהגבול הגלובלי הוא, 8 מ"ב, אז גם הגבול הקבוצתי יהיה 8 מ"ב.</p> +</div> + +<div class="note"> +<p><strong>לתשומת לבך</strong>: כאשר חורגים מהגבול הקבוצתי, או אם פינוי המקור אינו יכול לשחרר מספיק שטח, הדפדפן יצא עם החריגה <code>QuotaExceededError</code>.</p> +</div> + +<div class="note"> +<p><strong>לתשומת לבך</strong>: בכרום מכסת האחסנה הרכה והקשה השתנתה מאז <strong>M66</strong>. מידע נוסף ניתן למצוא <a href="https://chromium.googlesource.com/chromium/src/+/refs/heads/master/storage/browser/quota/quota_settings.cc#68">כאן.</a></p> +</div> + +<h2 id="מדיניותLRU">מדיניותLRU</h2> + +<p>כאשר שטח הדיסק מתמלא עד תום, מנהל המכסות מתחיל לנקות נתונים בהתבסס על מדיניות LRU — המקור בו נעשה שימוש רחוק ביותר מלאחרונה ימחק קודם, ואחר כך זה הבא אחריו, עד שהדפדפן כבר אינו חורג מהגבול.</p> + +<p>אנו עוקבים אחרי "זמן הגישה האחרון" עבור כל מקור באמצעות אחסנה זמנית. כאשר מושג הגבול הגלובלי עבור אחסנה זמנית (עוד אודות הגבול מאוחר יותר), אנו מנסים למצוא את כל המקורות שלא היו בשימוש (iכלומר אלה ללא לשוניות.ישומים פתוחים הממשיכים לשמור מאגרי מידע פתוחים). אלה ממויינים בשלב זה על פי "זמן הגישה האחרון". המקור שהיה בשימוש הכי רחוק מלאחרונה נמחקים בשלב זה עד שיש מספיק מקום להגשים את הבקשה שגרמה לפינוי המקור.</p> + +<h2 id="ראו_גם">ראו גם</h2> + +<ul> + <li><a href="http://www.html5rocks.com/en/tutorials/offline/quota-research/">Working with quota on mobile browsers</a>, by<a href="http://blog.agektmr.com" title="Eiji Kitamura"> Eiji Kitamura.</a> A detailed analysis of client-side storage on mobile browsers.</li> + <li><a href="https://developers.google.com/web/updates/2011/11/Quota-Management-API-Fast-Facts">Quota Management API: Fast Facts</a>, by<a href="http://blog.agektmr.com" title="Eiji Kitamura"> Eiji Kitamura.</a> A look at the Quota Management API in Chrome/Blink (which should include Opera, too).</li> +</ul> diff --git a/files/he/web/api/indexeddb_api/index.html b/files/he/web/api/indexeddb_api/index.html new file mode 100644 index 0000000000..957b6f96c5 --- /dev/null +++ b/files/he/web/api/indexeddb_api/index.html @@ -0,0 +1,165 @@ +--- +title: IndexedDB API +slug: Web/API/IndexedDB_API +tags: + - API + - Advanced + - Database + - IndexedDB + - Landing + - NeedsTranslation + - Reference + - Storage + - TopicStub +translation_of: Web/API/IndexedDB_API +--- +<div>{{DefaultAPISidebar("IndexedDB")}}</div> + +<p>IndexedDB is a low-level API for client-side storage of significant amounts of structured data, including files/blobs. This API uses indexes to enable high-performance searches of this data. While <a href="/en-US/docs/Web/API/Web_Storage_API">Web Storage</a> is useful for storing smaller amounts of data, it is less useful for storing larger amounts of structured data. IndexedDB provides a solution. This is the main landing page for MDN's IndexedDB coverage — here we provide links to the full API reference and usage guides, browser support details, and some explanation of key concepts.</p> + +<p>{{AvailableInWorkers}}</p> + +<div class="note"> +<p><strong>Note</strong>: IndexedDB API is powerful, but may seem too complicated for simple cases. If you'd prefer a simple API, try libraries such as <a href="https://localforage.github.io/localForage/">localForage</a>, <a href="https://dexie.org/">dexie.js</a>, <a href="https://github.com/erikolson186/zangodb">ZangoDB</a>, <a href="https://pouchdb.com/">PouchDB</a>, <a href="https://www.npmjs.com/package/idb">idb</a>, <a href="https://www.npmjs.com/package/idb-keyval">idb-keyval</a>, <a href="https://jsstore.net/">JsStore</a> and <a href="https://github.com/google/lovefield">lovefield</a> that make IndexedDB more programmer-friendly.</p> +</div> + +<h2 id="Key_concepts_and_usage">Key concepts and usage</h2> + +<p>IndexedDB is a transactional database system, like an SQL-based RDBMS. However, unlike SQL-based RDBMSes, which use fixed-column tables, IndexedDB is a JavaScript-based object-oriented database. IndexedDB lets you store and retrieve objects that are indexed with a <strong>key</strong>; any objects supported by the <a href="/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm">structured clone algorithm</a> can be stored. You need to specify the database schema, open a connection to your database, and then retrieve and update data within a series of <strong>transactions</strong>.</p> + +<ul> + <li>Read more about the <a href="/en-US/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB">Concepts behind IndexedDB</a>.</li> + <li>Learn to use IndexedDB asynchronously from first principles with our <a href="/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB">Using IndexedDB</a> guide.</li> + <li>Combine IndexedDB for storing data offline with Service Workers for storing assets offline, as outlined in <a href="/en-US/docs/Web/Progressive_web_apps/Offline_Service_workers">Making PWAs work offline with Service workers</a>.</li> +</ul> + +<div class="note"> +<p><strong>Note</strong>: Like most web storage solutions, IndexedDB follows a <a class="external" href="https://www.w3.org/Security/wiki/Same_Origin_Policy">same-origin policy</a>. So while you can access stored data within a domain, you cannot access data across different domains.</p> +</div> + +<h3 id="Synchronous_and_asynchronous">Synchronous and asynchronous</h3> + +<p>Operations performed using IndexedDB are done asynchronously, so as not to block applications. IndexedDB originally included both synchronous and asynchronous APIs. The synchronous API was intended for use only with <a href="/en-US/docs/Web/Guide/Performance/Using_web_workers">Web Workers</a> but was removed from the spec because it was unclear whether it was needed. However, the synchronous API may be reintroduced if there is enough demand from web developers.</p> + +<h3 id="Storage_limits_and_eviction_criteria">Storage limits and eviction criteria</h3> + +<p>There are a number of web technologies that store data of one kind or another on the client side (i.e. on your local disk). IndexedDB is most commonly talked about. The process by which the browser works out how much space to allocate to web data storage and what to delete when that limit is reached is not simple, and differs between browsers. <a href="/en-US/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria">Browser storage limits and eviction criteria</a> attempts to explain how this works, at least in the case of Firefox.</p> + +<h2 id="Interfaces">Interfaces</h2> + +<p>To get access to a database, call <a href="/en-US/docs/Web/API/IDBFactory.open"><code>open()</code></a> on the <a href="/en-US/docs/Web/API/IDBEnvironment.indexedDB"><code>indexedDB</code></a> attribute of a <a href="/en-US/docs/DOM/window">window</a> object. This method returns an {{domxref("IDBRequest")}} object; asynchronous operations communicate to the calling application by firing events on {{domxref("IDBRequest")}} objects.</p> + +<h3 id="Connecting_to_a_database">Connecting to a database</h3> + +<dl> + <dt>{{domxref("IDBEnvironment")}}</dt> + <dd>Provides access to IndexedDB functionality. It is implemented by the {{domxref("window")}} and {{domxref("worker")}} objects. This interface isn't part of the 2.0 specification.</dd> + <dt>{{domxref("IDBFactory")}}</dt> + <dd>Provides access to a database. This is the interface implemented by the global object {{domxref("WindowOrWorkerGlobalScope/indexedDB", "indexedDB")}} and is therefore the entry point for the API.</dd> + <dt>{{domxref("IDBOpenDBRequest")}}</dt> + <dd>Represents a request to open a database.</dd> + <dt>{{domxref("IDBDatabase")}}</dt> + <dd>Represents a connection to a database. It's the only way to get a transaction on the database.</dd> +</dl> + +<h3 id="Retrieving_and_modifying_data">Retrieving and modifying data</h3> + +<dl> + <dt>{{domxref("IDBTransaction")}}</dt> + <dd>Represents a transaction. You create a transaction on a database, specify the scope (such as which object stores you want to access), and determine the kind of access (read only or readwrite) that you want.</dd> + <dt>{{domxref("IDBRequest")}}</dt> + <dd>Generic interface that handles database requests and provides access to results.</dd> + <dt>{{domxref("IDBObjectStore")}}</dt> + <dd>Represents an object store that allows access to a set of data in an IndexedDB database, looked up via primary key.</dd> + <dt>{{domxref("IDBIndex")}}</dt> + <dd>Also allows access to a subset of data in an IndexedDB database, but uses an index to retrieve the record(s) rather than the primary key. This is sometimes faster than using {{domxref("IDBObjectStore")}}.</dd> + <dt>{{domxref("IDBCursor")}}</dt> + <dd>Iterates over object stores and indexes.</dd> + <dt>{{domxref("IDBCursorWithValue")}}</dt> + <dd>Iterates over object stores and indexes and returns the cursor's current value.</dd> + <dt>{{domxref("IDBKeyRange")}}</dt> + <dd>Defines a key range that can be used to retrieve data from a database in a certain range.</dd> + <dt>{{domxref("IDBLocaleAwareKeyRange")}} {{Non-standard_inline}}</dt> + <dd>Defines a key range that can be used to retrieve data from a database in a certain range, sorted according to the rules of the locale specified for a certain index (see <a href="/en-US/docs/Web/API/IDBObjectStore/createIndex#Parameters"><code>createIndex()</code>'s optionalParameters</a>.). This interface isn't part of the 2.0 specification.</dd> +</dl> + +<h3 id="Custom_event_interfaces">Custom event interfaces</h3> + +<p>This specification fires events with the following custom interface:</p> + +<dl> + <dt>{{domxref("IDBVersionChangeEvent")}}</dt> + <dd>The <code>IDBVersionChangeEvent</code> interface indicates that the version of the database has changed, as the result of an {{domxref("IDBOpenDBRequest.onupgradeneeded")}} event handler function.</dd> +</dl> + +<h3 id="Obsolete_interfaces">Obsolete interfaces</h3> + +<p>An early version of the specification also defined the following, now removed, interfaces. They are still documented in case you need to update previously written code:</p> + +<dl> + <dt>{{domxref("IDBVersionChangeRequest")}} {{obsolete_inline}}</dt> + <dd>Represents a request to change the version of a database. The way to change the version of the database has since changed (by calling {{domxref("IDBFactory.open")}} without also calling {{domxref("IDBDatabase.setVersion")}}), and the interface {{domxref("IDBOpenDBRequest")}} now has the functionality of the removed {{domxref("IDBVersionChangeRequest")}}.</dd> + <dt>{{domxref("IDBDatabaseException")}} {{obsolete_inline}}</dt> + <dd>Represents exception conditions that can be encountered while performing database operations.</dd> + <dt>{{domxref("IDBTransactionSync")}} {{obsolete_inline}}</dt> + <dd>Sync version of {{domxref("IDBTransaction")}}.</dd> + <dt>{{domxref("IDBObjectStoreSync")}} {{obsolete_inline}}</dt> + <dd>Sync version of {{domxref("IDBObjectStore")}}.</dd> + <dt>{{domxref("IDBIndexSync")}} {{obsolete_inline}}</dt> + <dd>Sync version of {{domxref("IDBIndex")}}.</dd> + <dt>{{domxref("IDBFactorySync")}} {{obsolete_inline}}</dt> + <dd>Sync version of {{domxref("IDBFactory")}}.</dd> + <dt>{{domxref("IDBEnvironmentSync")}} {{obsolete_inline}}</dt> + <dd>Sync version of {{domxref("IDBEnvironment")}}.</dd> + <dt>{{domxref("IDBDatabaseSync")}} {{obsolete_inline}}</dt> + <dd>Sync version of {{domxref("IDBDatabase")}}.</dd> + <dt>{{domxref("IDBCursorSync")}} {{obsolete_inline}}</dt> + <dd>Sync version of {{domxref("IDBCursor")}}.</dd> +</dl> + +<h2 id="Examples">Examples</h2> + +<ul> + <li><a class="external" href="https://marco-c.github.io/eLibri/">eLibri:</a> A powerful library and eBook reader application, written by Marco Castelluccio, winner of the IndexedDB Mozilla DevDerby.</li> + <li><a class="external" href="https://github.com/chrisdavidmills/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a class="external" href="https://mdn.github.io/to-do-notifications/">view example live</a>): The reference application for the examples in the reference docs.</li> + <li><a class="external" href="https://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/">Storing images and files in IndexedDB</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">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName("IndexedDB 2")}}</td> + <td>{{Spec2("IndexedDB 2")}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('IndexedDB')}}</td> + <td>{{Spec2('IndexedDB')}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a class="external" href="https://localforage.github.io/localForage/">localForage</a>: A Polyfill providing a simple name:value syntax for client-side data storage, which uses IndexedDB in the background, but falls back to WebSQL and then localStorage in browsers that don't support IndexedDB.</li> + <li><a class="external" href="https://www.dexie.org/">Dexie.js</a>: A wrapper for IndexedDB that allows much faster code development via nice, simple syntax.</li> + <li><a href="https://github.com/erikolson186/zangodb">ZangoDB</a>: A MongoDB-like interface for IndexedDB that supports most of the familiar filtering, projection, sorting, updating and aggregation features of MongoDB.</li> + <li><a href="https://jsstore.net/">JsStore</a>: An IndexedDB wrapper with SQL like syntax.</li> + <li><a href="https://github.com/mWater/minimongo">MiniMongo</a>: A client-side in-memory mongodb backed by localstorage with server sync over http. MiniMongo is used by MeteorJS.</li> + <li><a href="https://pouchdb.com">PouchDB</a>: A client-side implementation of CouchDB in the browser using IndexedDB</li> + <li><a href="https://www.npmjs.com/package/idb">idb</a>: A tiny (~1.15k) library that mostly mirrors the IndexedDB API, but with small improvements that make a big difference to usability.</li> + <li><a href="https://www.npmjs.com/package/idb-keyval">idb-keyval</a>: A super-simple-small (~600B) promise-based keyval store implemented with IndexedDB</li> + <li><a href="https://www.npmjs.com/package/@sifrr/storage">sifrr-storage:</a> A small (~2kB) promise based library for client side key-value storage. Works with IndexedDB, localStorage, WebSQL, Cookies. Can automatically use supported storage available based on priority.</li> + <li><a href="https://github.com/google/lovefield">lovefield</a>: <span class="mr-2 text-gray-dark">Lovefield is a relational database for web apps. Written in JavaScript, works cross-browser. Provides SQL-like APIs that are fast, safe, and easy to use.</span></li> +</ul> diff --git a/files/he/web/api/storage/clear/index.html b/files/he/web/api/storage/clear/index.html new file mode 100644 index 0000000000..f93b7cf4a4 --- /dev/null +++ b/files/he/web/api/storage/clear/index.html @@ -0,0 +1,52 @@ +--- +title: Storage.clear() +slug: Web/API/Storage/clear +translation_of: Web/API/Storage/clear +--- +<p>{{APIRef("Web Storage API")}}</p> + +<p>פונקציית <strong><code>()clear</code></strong> מאפשרת לנקות את כל המפתחות מהאחסון המקומי.</p> + +<h2 id="תחביר">תחביר</h2> + +<pre class="brush: js"><em>storage</em>.clear();</pre> + +<h3 id="ערך_חוזר">ערך חוזר</h3> + +<p>undefined.</p> + +<h2 id="דוגמאות">דוגמאות</h2> + +<p><font><font>הפונקציה הבאה יוצרת שלושה פריטים באחסון המקומי, ולאחר מכן מוחקת אותם.</font></font></p> + +<pre class="brush: js">function populateStorage() { + localStorage.setItem('bgcolor', 'red'); + localStorage.setItem('font', 'Helvetica'); + localStorage.setItem('image', 'miGato.png'); + + localStorage.clear(); +} +</pre> + +<h2 id="מפרט">מפרט</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', 'webstorage.html#dom-storage-clear', 'Storage.clear')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="תאימות_דפדפן">תאימות דפדפן</h2> + + + +<p>{{Compat("api.Storage.clear")}}</p> diff --git a/files/he/web/api/storage/getitem/index.html b/files/he/web/api/storage/getitem/index.html new file mode 100644 index 0000000000..d18fcf9d3d --- /dev/null +++ b/files/he/web/api/storage/getitem/index.html @@ -0,0 +1,75 @@ +--- +title: localStorage.getItem() +slug: Web/API/Storage/getItem +translation_of: Web/API/Storage/getItem +--- +<p>{{APIRef("Web Storage API")}}</p> + +<p> </p> + +<p>פונקציית <strong><code>()getItem</code></strong> מאפשרת לאחזר נתונים מהאחסון המקומי באמצעות שם המפתח.<br> + במידה והמפתח שרוצים לאחזר אינו קיים באחסון המקומי, יוחזר הערך null.</p> + +<h2 id="תחביר">תחביר</h2> + +<pre class="syntaxbox">var <em>aValue</em> = localStorage.getItem(<em>keyName</em>); +</pre> + +<h3 id="פרמטרים">פרמטרים</h3> + +<dl> + <dt><em><code>keyName</code></em></dt> + <dd>שם המפתח אותו רוצים לאחזר.</dd> +</dl> + +<h3 id="ערך_חוזר">ערך חוזר</h3> + +<p>במידה והמפתח קיים באחסון המקומי הוא יחזיר את ערכו. במידה והמפתח אינו קיים יוחזר הערך null.</p> + +<h2 id="דוגמאות">דוגמאות</h2> + +<p>הפונקציה הבאה מאחזרת שלושה פריטי נתונים מהאחסון המקומי ולאחר מכן משתמשת בהם כדי להגדיר גיליונות סגנון מדורגים.</p> + +<pre class="brush: js">function setStyles() { + var currentColor = localStorage.getItem('bgcolor'); + var currentFont = localStorage.getItem('font'); + var currentImage = localStorage.getItem('image'); + + currentColor = document.getElementById('bgcolor').value; + currentFont = document.getElementById('font').value; + currentImage = document.getElementById('image').value; + + htmlElem.style.backgroundColor = '#' + currentColor; + pElem.style.fontFamily = currentFont; + imgElem.setAttribute('src', currentImage); +}</pre> + +<h2 id="מפרט">מפרט</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', 'webstorage.html#dom-storage-getitem', 'Storage.getItem')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="תאימות_דפדפן">תאימות דפדפן</h2> + + + +<p>{{Compat("api.Storage.getItem")}}</p> + +<h2 id="ראו_גם">ראו גם</h2> + +<ul> + <li><a href="https://developer.mozilla.org/he/docs/Web/API/Storage/setItem">()Storage.setItem </a></li> + <li><a href="/he/docs/Web/API/Storage/removeItem">()Storage.removeItem</a></li> +</ul> diff --git a/files/he/web/api/storage/index.html b/files/he/web/api/storage/index.html new file mode 100644 index 0000000000..b89a1ef6a2 --- /dev/null +++ b/files/he/web/api/storage/index.html @@ -0,0 +1,107 @@ +--- +title: Storage +slug: Web/API/Storage +tags: + - API + - Interface + - NeedsTranslation + - Reference + - Storage + - TopicStub + - Web Storage + - data +translation_of: Web/API/Storage +--- +<p>{{APIRef("Web Storage API")}}</p> + +<p>The <code>Storage</code> interface of the Web Storage API provides access to a particular domain's session or local storage. It allows, for example, the addition, modification, or deletion of stored data items.</p> + +<p>To manipulate, for instance, the session storage for a domain, a call to the {{domxref("Window.sessionStorage")}} is made; whereas for local storage the call is made to {{domxref("Window.localStorage")}}.</p> + +<h2 id="Properties">Properties</h2> + +<dl> + <dt>{{domxref("Storage.length")}} {{readonlyInline}}</dt> + <dd>Returns an integer representing the number of data items stored in the <code>Storage</code> object.</dd> +</dl> + +<h2 id="Methods">Methods</h2> + +<dl> + <dt>{{domxref("Storage.key()")}}</dt> + <dd>When passed a number n, this method will return the name of the nth key in the storage.</dd> +</dl> + +<dl> + <dt>{{domxref("Storage.getItem()")}}</dt> + <dd>When passed a key name, will return that key's value.</dd> + <dt>{{domxref("Storage.setItem()")}}</dt> + <dd>When passed a key name and value, will add that key to the storage, or update that key's value if it already exists.</dd> + <dt>{{domxref("Storage.removeItem()")}}</dt> + <dd>When passed a key name, will remove that key from the storage.</dd> + <dt>{{domxref("Storage.clear()")}}</dt> + <dd>When invoked, will empty all keys out of the storage.</dd> +</dl> + +<h2 id="Examples">Examples</h2> + +<p>Here we access a <code>Storage</code> object by calling <code>localStorage</code>. We first test whether the local storage contains data items using <code>!localStorage.getItem('bgcolor')</code>. If it does, we run a function called <code>setStyles()</code> that grabs the data items using {{domxref("Storage.getItem()")}} and uses those values to update page styles. If it doesn't, we run another function, <code>populateStorage()</code>, which uses {{domxref("Storage.setItem()")}} to set the item values, then runs <code>setStyles()</code>.</p> + +<pre class="brush: js">if(!localStorage.getItem('bgcolor')) { + populateStorage(); +} +setStyles(); + +function populateStorage() { + localStorage.setItem('bgcolor', document.getElementById('bgcolor').value); + localStorage.setItem('font', document.getElementById('font').value); + localStorage.setItem('image', document.getElementById('image').value); +} + +function setStyles() { + var currentColor = localStorage.getItem('bgcolor'); + var currentFont = localStorage.getItem('font'); + var currentImage = localStorage.getItem('image'); + + document.getElementById('bgcolor').value = currentColor; + document.getElementById('font').value = currentFont; + document.getElementById('image').value = currentImage; + + htmlElem.style.backgroundColor = '#' + currentColor; + pElem.style.fontFamily = currentFont; + imgElem.setAttribute('src', currentImage); +}</pre> + +<div class="note"> +<p><strong>Note</strong>: To see this running as a complete working example, see our <a href="https://mdn.github.io/dom-examples/web-storage/">Web Storage Demo</a>.</p> +</div> + +<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', 'webstorage.html#the-storage-interface', 'Storage')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("api.Storage")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a></li> + <li><a href="/en-US/docs/Web/API/Window/localStorage">Window.localStorage</a></li> +</ul> diff --git a/files/he/web/api/storage/key/index.html b/files/he/web/api/storage/key/index.html new file mode 100644 index 0000000000..9dfce0e52b --- /dev/null +++ b/files/he/web/api/storage/key/index.html @@ -0,0 +1,55 @@ +--- +title: Storage.key() +slug: Web/API/Storage/key +translation_of: Web/API/Storage/key +--- +<p>{{APIRef("Web Storage API")}}</p> + +<p>פונקציית <strong><code>()key</code></strong> מאפשרת לאחזר את שם המפתח באמצעות אינדקס.</p> + +<h2 id="תחביר">תחביר</h2> + +<pre class="syntaxbox">var <em>aKeyName</em> = <em>storage</em>.key(<em>index</em>);</pre> + +<h3 id="פרמטרים">פרמטרים</h3> + +<dl> + <dt><em>index</em></dt> + <dd>מספר שלם המייצג את מיקום המפתח שברצוננו לאחזר.</dd> +</dl> + +<h3 id="ערך_חוזר">ערך חוזר</h3> + +<p>במידה והמפתח קיים באחסון המקומי הוא יחזיר את שמו. במידה והמפתח אינו קיים יוחזר הערך null.</p> + +<h2 id="דוגמאות">דוגמאות</h2> + +<p>הפונקציה הבאה חוזרת על פריטי האחסון המקומיים ומקבלת את הערך שהוגדר עבור כל מפתח:</p> + +<pre class="brush: js">for(var i =0; i < localStorage.length; i++){ + console.log(localStorage.getItem(localStorage.key(i))); +} +</pre> + +<h2 id="מפרט">מפרט</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', 'webstorage.html#dom-storage-key', 'Storage.key')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("api.Storage.key")}}</p> diff --git a/files/he/web/api/storage/length/index.html b/files/he/web/api/storage/length/index.html new file mode 100644 index 0000000000..6939e0bd1f --- /dev/null +++ b/files/he/web/api/storage/length/index.html @@ -0,0 +1,51 @@ +--- +title: Storage.length +slug: Web/API/Storage/length +translation_of: Web/API/Storage/length +--- +<p>{{APIRef("Web Storage API")}}</p> + +<p>המאפיין <strong><code>length</code></strong> מאפשר לאחזר את מספר כל הפריטים שנמצאים באחסון המקומי ולהציגם באמצעות מספר שלם.</p> + +<h2 id="תחביר">תחביר</h2> + +<pre class="syntaxbox">var <em>aLength</em> = <em>Storage</em>.length;</pre> + +<h3 id="ערך_חוזר">ערך חוזר</h3> + +<p>מספר שלם.</p> + +<h2 id="דוגמאות">דוגמאות</h2> + +<p>הפונקציה הבאה מוסיפה שלושה פריטים לאחסון המקומי ולאחר מכן מחזירה את מספר כל הפריטים שנמצאים באחסון המקומי:</p> + +<pre class="brush: js">function populateStorage() { + localStorage.setItem('bgcolor', 'yellow'); + localStorage.setItem('font', 'Helvetica'); + localStorage.setItem('image', 'cats.png'); + + localStorage.length; // should return 3 +}</pre> + +<h2 id="מפרט">מפרט</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', 'webstorage.html#dom-storage-length', 'Storage.length')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="תאימות_דפדפן">תאימות דפדפן</h2> + + + +<p>{{Compat("api.Storage.length")}}</p> diff --git a/files/he/web/api/storage/removeitem/index.html b/files/he/web/api/storage/removeitem/index.html new file mode 100644 index 0000000000..5760eae6b3 --- /dev/null +++ b/files/he/web/api/storage/removeitem/index.html @@ -0,0 +1,66 @@ +--- +title: Storage.removeItem() +slug: Web/API/Storage/removeItem +translation_of: Web/API/Storage/removeItem +--- +<p>{{APIRef("Web Storage API")}}</p> + +<p>פונקציית <strong><code>()removeItem</code></strong> מאפשרת לאחזר נתונים מהאחסון המקומי באמצעות שם המפתח.<br> + ובמידה ושם המפתח לא קיים באחסון המקומי לא יבוצעו שינויים.</p> + +<h2 id="תחביר">תחביר</h2> + +<pre class="syntaxbox"><em>storage</em>.removeItem(<em>keyName</em>);</pre> + +<h3 id="פרמטרים">פרמטרים</h3> + +<dl> + <dt><em><u>keyName</u></em></dt> + <dd>שם המפתח אותו רוצים למחוק.</dd> +</dl> + +<h3 id="ערך_חוזר">ערך חוזר</h3> + +<p>חלל ריק.</p> + +<h2 id="דוגמאות">דוגמאות</h2> + +<p>הפונקציה הבאה יוצרת שלושה פריטים בתוך האחסון המקומי ולאחר מכן מסירה את פריט התמונה מהאחסון המקומי.</p> + +<pre class="brush: js">function populateStorage() { + localStorage.setItem('bgcolor', 'red'); + localStorage.setItem('font', 'Helvetica'); + localStorage.setItem('image', 'myCat.png'); + + localStorage.removeItem('image'); +}</pre> + +<h2 id="מפרט">מפרט</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', 'webstorage.html#dom-storage-removeitem', 'Storage.removeItem')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="תאימות_דפדפן">תאימות דפדפן</h2> + + + +<p>{{Compat("api.Storage.removeItem")}}</p> + +<h2 id="ראו_גם">ראו גם</h2> + +<ul> + <li><a href="https://developer.mozilla.org/he/docs/Web/API/Storage/setItem">()Storage.setItem </a></li> + <li><a href="/he/docs/Web/API/Storage/getItem">()Storage.getItem</a></li> +</ul> diff --git a/files/he/web/api/storage/setitem/index.html b/files/he/web/api/storage/setitem/index.html new file mode 100644 index 0000000000..84225ee467 --- /dev/null +++ b/files/he/web/api/storage/setitem/index.html @@ -0,0 +1,69 @@ +--- +title: Storage.setItem() +slug: Web/API/Storage/setItem +translation_of: Web/API/Storage/setItem +--- +<p>{{APIRef("Web Storage API")}}<br> + פונקציית <strong><code>()setItem</code></strong> מאפשרת להוסיף נתונים אל האחסון המקומי באמצעות שני פרמטרים: שם מפתח וערך שאותם תיצור או תעדכן במידה וקיימים.</p> + +<h2 id="תחביר">תחביר</h2> + +<pre class="syntaxbox"><em>storage</em>.setItem(<em>keyName</em>, <em>keyValue</em>);</pre> + +<h3 id="פרמטרים">פרמטרים</h3> + +<dl> + <dt><code>keyName</code></dt> + <dd>מכיל את שמו של המפתח אותו יש ליצור או לעדכן.</dd> + <dt><code>keyValue</code></dt> + <dd>מכיל את שם הערך שיתווסף למפתח אותו אנו יוצרים או מעדכנים.</dd> +</dl> + +<h3 id="ערך_חוזר">ערך חוזר</h3> + +<p><code>undefined</code>.</p> + +<h3 id="החרגות">החרגות</h3> + +<p>במידה והאחסון מלא המערכות עשויה לנקות נתונים מהאחסון המקומי.<br> + בגרסה הניידת של דפדפן Safari, במידה והמשתמש נכנס אל מצב פרטי המערכת אינה שומרת נתונים באחסון המקומי ומסירה אותם באופן אוטומטי בשל מגבלת גודל של 0 בתים.</p> + +<h2 id="דוגמאות">דוגמאות</h2> + +<p>הפונקציה הבאה יוצרת שלושה פריטי נתונים בתוך האחסון המקומי.</p> + +<pre class="brush: js">function populateStorage() { + localStorage.setItem('bgcolor', 'red'); + localStorage.setItem('font', 'Helvetica'); + localStorage.setItem('image', 'myCat.png'); +}</pre> + +<h2 id="מפרט">מפרט</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', 'webstorage.html#dom-storage-setitem', 'Storage.setItem')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="תאימות_דפדפן">תאימות דפדפן</h2> + + + +<p>{{Compat("api.Storage.setItem")}}</p> + +<h2 id="ראו_גם">ראו גם</h2> + +<ul> + <li><a href="/he/docs/Web/API/Storage/getItem">()Storage.getItem</a></li> + <li><a href="/he/docs/Web/API/Storage/removeItem">()Storage.removeItem</a></li> +</ul> diff --git a/files/he/web/api/web_storage_api/index.html b/files/he/web/api/web_storage_api/index.html new file mode 100644 index 0000000000..51a64e09b3 --- /dev/null +++ b/files/he/web/api/web_storage_api/index.html @@ -0,0 +1,111 @@ +--- +title: ממשק פיתוח היישומים Web Storage +slug: Web/API/Web_Storage_API +translation_of: Web/API/Web_Storage_API +--- +<div style="direction: ltr !important;">{{DefaultAPISidebar("Web Storage API")}}</div> + +<p>The <strong>Web Storage API</strong> provides mechanisms by which browsers can store key/value pairs, in a much more intuitive fashion than using {{glossary("cookie", "cookies")}}.</p> + +<h2 id="Web_Storage_concepts_and_usage">Web Storage concepts and usage</h2> + +<p>The two mechanisms within Web Storage are as follows:</p> + +<ul> + <li><code>sessionStorage</code> maintains a separate storage area for each given origin that's available for the duration of the page session (as long as the browser is open, including page reloads and restores) + + <ul> + <li>Stores data only for a session, meaning that the data is stored until the browser (or tab) is closed.</li> + <li>Data is never transferred to the server.</li> + <li>Storage limit is larger than a cookie (at most 5MB).</li> + </ul> + </li> + <li><code>localStorage</code> does the same thing, but persists even when the browser is closed and reopened. + <ul> + <li>Stores data with no expiration date, and gets cleared only through JavaScript, or clearing the Browser cache / Locally Stored Data.</li> + <li>Storage limit is the maximum amongst the three.</li> + </ul> + </li> +</ul> + +<p>These mechanisms are available via the {{domxref("Window.sessionStorage")}} and {{domxref("Window.localStorage")}} properties (to be more precise, in supporting browsers the <code>Window</code> object implements the <code>WindowLocalStorage</code> and <code>WindowSessionStorage</code> objects, which the <code>localStorage</code> and <code>sessionStorage</code> properties hang off) — invoking one of these will create an instance of the {{domxref("Storage")}} object, through which data items can be set, retrieved and removed. A different Storage object is used for the <code>sessionStorage</code> and <code>localStorage</code> for each origin — they function and are controlled separately.</p> + +<div class="note"> +<p><strong>Note</strong>: From Firefox 45 onwards, when the browser crashes/restarts, the amount of data saved per origin is limited to 10MB. This has been done to avoid memory issues caused by excessive usage of web storage.</p> +</div> + +<div class="note"> +<p><strong>Note</strong>: Access to Web Storage from third-party IFrames is denied if the user has <a href="https://support.mozilla.org/en-US/kb/disable-third-party-cookies">disabled third-party cookies</a> (Firefox implements this behaviour from <a href="/en-US/docs/Mozilla/Firefox/Releases/43">version 43</a> onwards.)</p> +</div> + +<div class="note"> +<p><strong>Note:</strong> Web Storage is not the same as <a href="/en-US/docs/Storage" title="Storage">mozStorage</a> (Mozilla's XPCOM interfaces to SQLite) or the <a href="/en-US/docs/Session_store_API" title="Session_store_API">Session store API</a> (an <a href="/en-US/docs/XPCOM" title="XPCOM">XPCOM</a> storage utility for use by extensions).</p> +</div> + +<h2 id="Web_Storage_interfaces">Web Storage interfaces</h2> + +<dl> + <dt>{{domxref("Storage")}}</dt> + <dd>Allows you to set, retrieve and remove data for a specific domain and storage type (session or local.)</dd> + <dt>{{domxref("Window")}}</dt> + <dd>The Web Storage API extends the {{domxref("Window")}} object with two new properties — {{domxref("Window.sessionStorage")}} and {{domxref("Window.localStorage")}} — which provide access to the current domain's session and local {{domxref("Storage")}} objects respectively, and a {{domxref("Window.onstorage")}} event handler that fires when a storage area changes (e.g. a new item is stored.)</dd> + <dt>{{domxref("StorageEvent")}}</dt> + <dd>The <code title="event-storage">storage</code> event is fired on a document's <code>Window</code> object when a storage area changes.</dd> +</dl> + +<h2 id="Examples">Examples</h2> + +<p>To illustrate some typical web storage usage, we have created a simple example, imaginatively called <a href="https://github.com/mdn/dom-examples/tree/master/web-storage">Web Storage Demo</a>. The <a href="https://mdn.github.io/dom-examples/web-storage/">landing page</a> provides controls that can be used to customize the colour, font and decorative image. When you choose different options, the page is instantly updated; in addition your choices are stored in <code>localStorage</code>, so that when you leave the page then load it again later on your choices are remembered.</p> + +<p>In addition, we have provided an <a href="https://mdn.github.io/dom-examples/web-storage/event.html">event output page</a> — if you load this page in another tab, then make changes to your choices in the landing page, you'll see the updated storage information outputted as the {{domxref("StorageEvent")}} is fired.</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('HTML WHATWG', 'webstorage.html#webstorage')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<h3 id="Window.localStorage"><code>Window.localStorage</code></h3> + +<div> + + +<p>{{Compat("api.Window.localStorage")}}</p> + +<h3 id="Window.sessionStorage"><code>Window.sessionStorage</code></h3> + +<div> +<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.Window.sessionStorage")}}</p> +</div> +</div> + +<h2 id="Private_Browsing_Incognito_modes">Private Browsing / Incognito modes</h2> + +<p>Most modern browsers support a privacy option called 'Incognito', 'Private Browsing' or something similar that doesn't store data like history and cookies. This is fundamentally incompatible with Web Storage for obvious reasons. As such, browser vendors are experimenting with different scenarios for how to deal with this incompatibility.</p> + +<p>Most browsers have opted for a strategy where storage APIs are still available and seemingly fully functional, with the one big difference that all stored data is wiped after the browser is closed. For these browsers there are still different interpretations of what should be done with existing stored data (from a regular browsing session). Should it be available to read when in Private mode? Then there are some browsers, most notably Safari, that have opted for a solution where storage is available, but is empty and has a quota of 0 bytes assigned, effectively making it impossible to write data to it.</p> + +<p>Developers should be aware of these different implementations and take them into account when developing websites depending on Web Storage APIs. For more information please have a look at <a href="https://blog.whatwg.org/this-week-in-html-5-episode-30">this WHATWG blog post</a> that specifically deals with this topic.</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a></li> + <li><a href="/en-US/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria">Browser storage limits and eviction criteria</a></li> + <li><a href="https://medium.com/@ramsunvtech/onfocus-html5-storage-apis-b45d92aa424b">HTML5 Storage API By Venkatraman</a></li> +</ul> diff --git a/files/he/web/api/window/alert/index.html b/files/he/web/api/window/alert/index.html new file mode 100644 index 0000000000..0346b5f73a --- /dev/null +++ b/files/he/web/api/window/alert/index.html @@ -0,0 +1,70 @@ +--- +title: Window.alert() +slug: Web/API/Window/alert +tags: + - אזהרה + - חלון הודעה + - פופ-אפ +translation_of: Web/API/Window/alert +--- +<p>{{ APIRef }}</p> + +<p><strong><code>Window.alert()</code></strong> - מציגה הודעת אזהרה עם תוכן וכפתור לאישור וסגירה.</p> + +<h2 id="Syntax" name="Syntax">תחביר</h2> + +<pre class="syntaxbox">window.alert(<em>message</em>);</pre> + +<h3 id="פרמטרים">פרמטרים</h3> + +<dl> + <dt><code>message</code> {{optional_inline}}</dt> + <dd>מחרוזת שתופיעה כגוף ההודעה בתיבת הדו-שיח של ההתראה.</dd> +</dl> + +<h2 id="Example" name="Example">דוגמאות</h2> + +<pre class="brush: js">window.alert("Hello world!"); +alert("Hello world!");</pre> + +<p>שתי הדוגמאות מייצרות את ההודעה הבאה:</p> + +<p><img alt="Image:AlertHelloWorld.png" src="/files/130/AlertHelloWorld.png"></p> + +<h2 id="Notes" name="Notes">הערות</h2> + +<p> </p> + +<p>תפקידן של תיבות ההתראה הינן להצגת הודעות שאינן דורשות תגובה מצד המשתמש, מלבד היכרות וקריאת ההודעה.</p> + +<p> </p> + +<h2 id="Specification" name="Specification">מפרט</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', 'timers-and-user-prompts.html#dom-alert', 'alert()')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="תאימות_דפדפן">תאימות דפדפן</h2> + + + +<p>{{Compat("api.Window.alert")}}</p> + +<h2 id="See_also" name="See_also">ראה גם</h2> + +<ul> + <li>{{domxref("window.confirm","confirm")}}</li> + <li>{{domxref("window.prompt","prompt")}}</li> +</ul> diff --git a/files/he/web/api/window/confirm/index.html b/files/he/web/api/window/confirm/index.html new file mode 100644 index 0000000000..54ab3e903a --- /dev/null +++ b/files/he/web/api/window/confirm/index.html @@ -0,0 +1,70 @@ +--- +title: Window.confirm() +slug: Web/API/Window/confirm +tags: + - אישור הודעה + - דפדפן + - הודעה + - חלון התראה + - פופ-אפ +translation_of: Web/API/Window/confirm +--- +<div>{{ApiRef("Window")}}</div> + +<div><code><strong>Window.confirm()</strong></code> - מציגה תיבת דו-שיח עם תוכן וכפתורי אישור וביטול.</div> + +<h2 id="Syntax" name="Syntax">תחביר</h2> + +<pre><em>result</em> = window.confirm(<em>message</em>); +</pre> + +<ul> + <li><code>message</code> - מחרוזת שתופיע בגוף ההודעה.</li> + <li><code>result</code> - ערך בוליאני בו מצוינת בחירת המשתמש (אישור או ביטול).</li> +</ul> + +<h2 id="Example" name="Example">דוגמאות</h2> + +<pre>if (window.confirm("Do you really want to leave?")) { + window.open("exit.html", "Thanks for Visiting!"); +} +</pre> + +<p>הדוגמה תציג את ההודעה הבאה:</p> + +<p><img alt="firefox confirm" src="https://mdn.mozillademos.org/files/7163/firefoxcomfirmdialog_zpsf00ec381.png" style="height: 119px; width: 354px;"><br> + </p> + +<h2 id="Notes" name="Notes">הערות</h2> + +<p><span class="comment">The following text is shared between this article, DOM:window.prompt and DOM:window.alert</span> תיבות דו-שיח מונעות מהמשתמש גישה לממשק התוכנית עד אשר היא תיסגר.</p> + +<h2 id="Specification" name="Specification">מפרט</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', 'timers-and-user-prompts.html#dom-confirm', 'confirm()')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="תאימות_דפדפן">תאימות דפדפן</h2> + + + +<p>{{Compat("api.Window.confirm")}}</p> + +<h2 id="See_also" name="See_also">ראה גם</h2> + +<ul> + <li>{{domxref("window.alert","alert")}}</li> + <li>{{domxref("window.prompt","prompt")}}</li> +</ul> diff --git a/files/he/web/api/window/index.html b/files/he/web/api/window/index.html new file mode 100644 index 0000000000..70b807464b --- /dev/null +++ b/files/he/web/api/window/index.html @@ -0,0 +1,509 @@ +--- +title: Window +slug: Web/API/Window +tags: + - API + - DOM + - Interface + - JavaScript + - NeedsTranslation + - Reference + - Tab + - TopicStub + - Window +translation_of: Web/API/Window +--- +<div>{{APIRef("DOM")}}</div> + +<p><span class="seoSummary">The <strong><code>Window</code></strong> interface represents a window containing a DOM document; the <code>document</code> property points to the <a href="/en-US/docs/DOM/document">DOM document</a> loaded in that window.</span> A window for a given document can be obtained using the {{domxref("document.defaultView")}} property.</p> + +<p>A global variable, <code>window</code>, representing the window in which the script is running, is exposed to JavaScript code.</p> + +<p>The <code>Window</code> interface is home to a variety of functions, namespaces, objects, and constructors which are not necessarily directly associated with the concept of a user interface window. However, the <code>Window</code> interface is a suitable place to include these items that need to be globally available. Many of these are documented in the <a href="/en-US/docs/Web/JavaScript/Reference">JavaScript Reference</a> and the <a href="/en-US/docs/Web/API/Document_Object_Model" title="/en-US/docs/Web/API/Document_Object_Model">DOM Reference</a>.</p> + +<p>In a tabbed browser, each tab is represented by its own <code>Window</code> object; the global <code>window</code> seen by JavaScript code running within a given tab always represents the tab in which the code is running. That said, even in a tabbed browser, some properties and methods still apply to the overall window that contains the tab, such as {{Domxref("Window.resizeTo", "resizeTo()")}} and {{Domxref("Window.innerHeight", "innerHeight")}}. Generally, anything that can't reasonably pertain to a tab pertains to the window instead.</p> + +<p>{{InheritanceDiagram}}</p> + +<h2 id="Properties">Properties</h2> + +<p><em>This interface inherits properties from the {{domxref("EventTarget")}} interface and implements properties from the {{domxref("WindowOrWorkerGlobalScope")}} and {{domxref("WindowEventHandlers")}} mixins.</em></p> + +<p>Note that properties which are objects (e.g.,. for overriding the prototype of built-in elements) are listed in a separate section below.</p> + +<dl> + <dt>{{domxref("Window.closed")}} {{Non-standard_inline}} {{readOnlyInline}}</dt> + <dd>This property indicates whether the current window is closed or not.</dd> + <dt>{{domxref("Window.console")}} {{ReadOnlyInline}}</dt> + <dd>Returns a reference to the console object which provides access to the browser's debugging console.</dd> + <dt>{{domxref("Window.content")}} and Window._content {{Non-standard_inline}} {{obsolete_inline}} {{ReadOnlyInline}}</dt> + <dd>Returns a reference to the content element in the current window. Since Firefox 57 (initially Nightly-only), both versions are only available from chrome (privileged) code, and not available to the web anymore.</dd> + <dt>{{domxref("Window.controllers")}} {{non-standard_inline}} {{ReadOnlyInline}}</dt> + <dd>Returns the XUL controller objects for the current chrome window.</dd> + <dt>{{domxref("Window.customElements")}} {{ReadOnlyInline}}</dt> + <dd>returns a reference to the {{domxref("CustomElementRegistry")}} object, which can be used to register new <a href="/en-US/docs/Web/Web_Components/Using_custom_elements">custom elements</a> and get information about previously registered custom elements.</dd> + <dt>{{domxref("Window.crypto")}} {{readOnlyInline}}</dt> + <dd>Returns the browser crypto object.</dd> + <dt>{{domxref("Window.defaultStatus")}} {{Obsolete_inline("gecko23")}}</dt> + <dd>Gets/sets the status bar text for the given window.</dd> + <dt>{{domxref("Window.devicePixelRatio")}} {{non-standard_inline}} {{ReadOnlyInline}}</dt> + <dd>Returns the ratio between physical pixels and device independent pixels in the current display.</dd> + <dt>{{domxref("Window.dialogArguments")}} {{Fx_minversion_inline(3)}} {{ReadOnlyInline}}</dt> + <dd>Gets the arguments passed to the window (if it's a dialog box) at the time {{domxref("window.showModalDialog()")}} was called. This is an {{Interface("nsIArray")}}.</dd> + <dt>{{domxref("Window.directories")}} {{obsolete_inline}}</dt> + <dd>Synonym of {{domxref("window.personalbar")}}</dd> + <dt>{{domxref("Window.document")}} {{ReadOnlyInline}}</dt> + <dd>Returns a reference to the document that the window contains.</dd> + <dt>{{domxref("Window.DOMMatrix")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Returns a reference to a {{domxref("DOMMatrix")}} object, which represents 4x4 matrices, suitable for 2D and 3D operations.</dd> + <dt>{{domxref("Window.DOMMatrixReadOnly")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Returns a reference to a {{domxref("DOMMatrixReadOnly")}} object, which represents 4x4 matrices, suitable for 2D and 3D operations.</dd> + <dt>{{domxref("Window.DOMPoint")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Returns a reference to a {{domxref("DOMPoint")}} object, which represents a 2D or 3D point in a coordinate system.</dd> + <dt>{{domxref("Window.DOMPointReadOnly")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Returns a reference to a {{domxref("DOMPointReadOnly")}} object, which represents a 2D or 3D point in a coordinate system.</dd> + <dt>{{domxref("Window.DOMQuad")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Returns a reference to a {{domxref("DOMQuad")}} object, which provides represents a quadrilaterial object, that is one having four corners and four sides.</dd> + <dt>{{domxref("Window.DOMRect")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Returns a reference to a {{domxref("DOMRect")}} object, which represents a rectangle.</dd> + <dt>{{domxref("Window.DOMRectReadOnly")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Returns a reference to a {{domxref("DOMRectReadOnly")}} object, which represents a rectangle.</dd> + <dt>{{domxref("Window.event")}} {{ReadOnlyInline}}</dt> + <dd>Returns the <strong>current event</strong>, which is the event currently being handled by the JavaScript code's context, or <code>undefined</code> if no event is currently being handled. The {{domxref("Event")}} object passed directly to event handlers should be used instead whenever possible.</dd> + <dt>{{domxref("Window.frameElement")}} {{readOnlyInline}}</dt> + <dd>Returns the element in which the window is embedded, or null if the window is not embedded.</dd> + <dt>{{domxref("Window.frames")}} {{readOnlyInline}}</dt> + <dd>Returns an array of the subframes in the current window.</dd> + <dt>{{domxref("Window.fullScreen")}} {{gecko_minversion_inline("1.9")}}</dt> + <dd>This property indicates whether the window is displayed in full screen or not.</dd> + <dt>{{domxref("Window.globalStorage")}} {{gecko_minversion_inline("1.8.1")}} {{Non-standard_inline}} {{Obsolete_inline("gecko13")}}</dt> + <dd>Unsupported since Gecko 13 (Firefox 13). Use {{domxref("Window.localStorage")}} instead.<br> + Was: Multiple storage objects that are used for storing data across multiple pages.</dd> + <dt>{{domxref("Window.history")}} {{ReadOnlyInline}}</dt> + <dd>Returns a reference to the history object.</dd> + <dt>{{domxref("Window.innerHeight")}} {{readOnlyInline}}</dt> + <dd>Gets the height of the content area of the browser window including, if rendered, the horizontal scrollbar.</dd> + <dt>{{domxref("Window.innerWidth")}} {{readOnlyInline}}</dt> + <dd>Gets the width of the content area of the browser window including, if rendered, the vertical scrollbar.</dd> + <dt>{{domxref("Window.isSecureContext")}} {{experimental_inline}} {{readOnlyInline}}</dt> + <dd>Indicates whether a context is capable of using features that require secure contexts.</dd> + <dt>{{domxref("Window.length")}} {{readOnlyInline}}</dt> + <dd>Returns the number of frames in the window. See also {{domxref("window.frames")}}.</dd> + <dt>{{domxref("Window.location")}}</dt> + <dd>Gets/sets the location, or current URL, of the window object.</dd> + <dt>{{domxref("Window.locationbar")}} {{ReadOnlyInline}}</dt> + <dd>Returns the locationbar object, whose visibility can be toggled in the window.</dd> + <dt>{{domxref("Window.localStorage")}} {{readOnlyInline}} {{gecko_minversion_inline("1.9.1")}}</dt> + <dd>Returns a reference to the local storage object used to store data that may only be accessed by the origin that created it.</dd> + <dt>{{domxref("Window.menubar")}} {{ReadOnlyInline}}</dt> + <dd>Returns the menubar object, whose visibility can be toggled in the window.</dd> + <dt>{{domxref("Window.messageManager")}} {{gecko_minversion_inline("2.0")}}</dt> + <dd>Returns the <a href="/en-US/docs/The_message_manager">message manager</a> object for this window.</dd> + <dt>{{domxref("Window.mozAnimationStartTime")}} {{ReadOnlyInline}} {{gecko_minversion_inline("2.0")}} {{Deprecated_inline}}</dt> + <dd>The time in milliseconds since epoch at which the current animation cycle began. Use {{domxref("Animation.startTime")}} instead.</dd> + <dt>{{domxref("Window.mozInnerScreenX")}} {{ReadOnlyInline}} {{non-standard_inline}} {{gecko_minversion_inline("1.9.2")}}</dt> + <dd>Returns the horizontal (X) coordinate of the top-left corner of the window's viewport, in screen coordinates. This value is reported in CSS pixels. See <code>mozScreenPixelsPerCSSPixel</code> in {{interface("nsIDOMWindowUtils")}} for a conversion factor to adapt to screen pixels if needed.</dd> + <dt>{{domxref("Window.mozInnerScreenY")}} {{ReadOnlyInline}} {{non-standard_inline}} {{gecko_minversion_inline("1.9.2")}}</dt> + <dd>Returns the vertical (Y) coordinate of the top-left corner of the window's viewport, in screen coordinates. This value is reported in CSS pixels. See <code>mozScreenPixelsPerCSSPixel</code> for a conversion factor to adapt to screen pixels if needed.</dd> + <dt>{{domxref("Window.mozPaintCount")}} {{non-standard_inline}} {{ReadOnlyInline}} {{gecko_minversion_inline("2.0")}}</dt> + <dd>Returns the number of times the current document has been rendered to the screen in this window. This can be used to compute rendering performance.</dd> + <dt>{{domxref("Window.name")}}</dt> + <dd>Gets/sets the name of the window.</dd> + <dt>{{domxref("Window.navigator")}} {{readOnlyInline}}</dt> + <dd>Returns a reference to the navigator object.</dd> + <dt>{{domxref("Window.opener")}}</dt> + <dd>Returns a reference to the window that opened this current window.</dd> + <dt>{{domxref("Window.orientation")}} {{non-standard_inline}} {{deprecated_inline}} {{readOnlyInline}}</dt> + <dd>Returns the orientation in degrees (in 90 degree increments) of the viewport relative to the device's natural orientation.</dd> + <dt>{{domxref("Window.outerHeight")}} {{readOnlyInline}}</dt> + <dd>Gets the height of the outside of the browser window.</dd> + <dt>{{domxref("Window.outerWidth")}} {{readOnlyInline}}</dt> + <dd>Gets the width of the outside of the browser window.</dd> + <dt>{{domxref("Window.scrollX","Window.pageXOffset")}} {{readOnlyInline}}</dt> + <dd>An alias for {{domxref("window.scrollX")}}.</dd> + <dt>{{domxref("Window.scrollY","Window.pageYOffset")}} {{readOnlyInline}}</dt> + <dd>An alias for {{domxref("window.scrollY")}}</dd> + <dt>{{domxref("Window.parent")}} {{readOnlyInline}}</dt> + <dd>Returns a reference to the parent of the current window or subframe.</dd> + <dt>{{domxref("Window.performance")}} {{readOnlyInline}}</dt> + <dd>Returns a {{domxref("Performance")}} object, which includes the {{domxref("Performance.timing", "timing")}} and {{domxref("Performance.navigation", "navigation")}} attributes, each of which is an object providing <a href="/en-US/docs/Navigation_timing">performance-related</a> data. See also <a href="/en-US/docs/Web/API/Navigation_timing_API/Using_Navigation_Timing">Using Navigation Timing</a> for additional information and examples.</dd> + <dt>{{domxref("Window.personalbar")}} {{readOnlyInline}}</dt> + <dd>Returns the personalbar object, whose visibility can be toggled in the window.</dd> + <dt>{{domxref("Window.pkcs11")}} {{obsolete_inline(29)}}</dt> + <dd>Formerly provided access to install and remove PKCS11 modules.</dd> + <dt>{{domxref("Window.returnValue")}} {{Fx_minversion_inline(3)}}</dt> + <dd>The return value to be returned to the function that called {{domxref("window.showModalDialog()")}} to display the window as a modal dialog.</dd> + <dt>{{domxref("Window.screen")}} {{readOnlyInline}}</dt> + <dd>Returns a reference to the screen object associated with the window.</dd> + + <dt>{{domxref("Window.screenX")}} {{readOnlyInline}}</dt> + <dd>Returns the horizontal distance of the left border of the user's browser from the left side of the screen.</dd> + <dt>{{domxref("Window.screenY")}} {{readOnlyInline}}</dt> + <dd>Returns the vertical distance of the top border of the user's browser from the top side of the screen.</dd> + <dt>{{domxref("Window.scrollbars")}} {{readOnlyInline}}</dt> + <dd>Returns the scrollbars object, whose visibility can be toggled in the window.</dd> + <dt>{{domxref("Window.scrollMaxX")}} {{non-standard_inline}} {{ReadOnlyInline}}</dt> + <dd>The maximum offset that the window can be scrolled to horizontally, that is the document width minus the viewport width.</dd> + <dt>{{domxref("Window.scrollMaxY")}} {{non-standard_inline}} {{ReadOnlyInline}}</dt> + <dd>The maximum offset that the window can be scrolled to vertically (i.e., the document height minus the viewport height).</dd> + <dt>{{domxref("Window.scrollX")}} {{readOnlyInline}}</dt> + <dd>Returns the number of pixels that the document has already been scrolled horizontally.</dd> + <dt>{{domxref("Window.scrollY")}} {{readOnlyInline}}</dt> + <dd>Returns the number of pixels that the document has already been scrolled vertically.</dd> + <dt>{{domxref("Window.self")}} {{ReadOnlyInline}}</dt> + <dd>Returns an object reference to the window object itself.</dd> + <dt>{{domxref("Window.sessionStorage")}}</dt> + <dd>Returns a reference to the session storage object used to store data that may only be accessed by the origin that created it.</dd> + <dt>{{domxref("Window.sidebar")}} {{non-standard_inline}} {{ReadOnlyInline}}</dt> + <dd>Returns a reference to the window object of the sidebar.</dd> + <dt>{{domxref("Window.speechSynthesis")}} {{ReadOnlyInline}}</dt> + <dd>Returns a {{domxref("SpeechSynthesis")}} object, which is the entry point into using <a href="/en-US/docs/Web/API/Web_Speech_API">Web Speech API</a> speech synthesis functionality.</dd> + <dt>{{domxref("Window.status")}}</dt> + <dd>Gets/sets the text in the statusbar at the bottom of the browser.</dd> + <dt>{{domxref("Window.statusbar")}} {{readOnlyInline}}</dt> + <dd>Returns the statusbar object, whose visibility can be toggled in the window.</dd> + <dt>{{domxref("Window.toolbar")}} {{readOnlyInline}}</dt> + <dd>Returns the toolbar object, whose visibility can be toggled in the window.</dd> + <dt>{{domxref("Window.top")}} {{readOnlyInline}}</dt> + <dd>Returns a reference to the topmost window in the window hierarchy. This property is read only.</dd> + <dt>{{domxref("Window.visualViewport")}} {{readOnlyInline}}</dt> + <dd>Returns a {{domxref("VisualViewport")}} object which represents the visual viewport for a given window.</dd> + <dt>{{domxref("Window.window")}} {{ReadOnlyInline}}</dt> + <dd>Returns a reference to the current window.</dd> + <dt><code>window[0]</code>,<code> window[1]</code>, etc.</dt> + <dd>Returns a reference to the <code>window</code> object in the frames. See {{domxref("Window.frames")}} for more details.</dd> +</dl> + +<h3 id="Properties_implemented_from_elsewhere">Properties implemented from elsewhere</h3> + +<dl> + <dt>{{domxref("WindowOrWorkerGlobalScope.caches")}} {{readOnlyinline}}</dt> + <dd>Returns the {{domxref("CacheStorage")}} object associated with the current context. This object enables functionality such as storing assets for offline use, and generating custom responses to requests.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.indexedDB")}} {{readonlyInline}}</dt> + <dd>Provides a mechanism for applications to asynchronously access capabilities of indexed databases; returns an {{domxref("IDBFactory")}} object.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.isSecureContext")}} {{readOnlyinline}}</dt> + <dd>Returns a boolean indicating whether the current context is secure (<code>true</code>) or not (<code>false</code>).</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.origin")}} {{readOnlyinline}}</dt> + <dd>Returns the global object's origin, serialized as a string. (This does not yet appear to be implemented in any browser.)</dd> +</dl> + +<h2 id="Methods">Methods</h2> + +<p><em>This interface inherits methods from the {{domxref("EventTarget")}} interface and implements methods from {{domxref("WindowOrWorkerGlobalScope")}} and {{domxref("EventTarget")}}.</em></p> + +<dl> + <dt>{{domxref("Window.alert()")}}</dt> + <dd>Displays an alert dialog.</dd> + + <dt>{{domxref("Window.back()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Moves back one in the window history. This method is obsolete; you should instead use {{domxref("History.back", "window.history.back()")}}.</dd> + <dt>{{domxref("Window.blur()")}}</dt> + <dd>Sets focus away from the window.</dd> + <dt>{{domxref("Window.cancelAnimationFrame()")}} {{experimental_inline}}</dt> + <dd>Enables you to cancel a callback previously scheduled with {{domxref("Window.requestAnimationFrame")}}.</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.captureEvents()")}} {{Deprecated_inline}}</dt> + <dd>Registers the window to capture all events of the specified type.</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.disableExternalCapture()")}} {{obsolete_inline(24)}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.dispatchEvent()")}}</dt> + <dd>Used to trigger an event.</dd> + <dt>{{domxref("Window.dump()")}} {{Non-standard_inline}}</dt> + <dd>Writes a message to the console.</dd> + <dt>{{domxref("Window.enableExternalCapture()")}} {{obsolete_inline(24)}}</dt> + <dd>{{todo("NeedsContents")}}</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.forward()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Moves the window one document forward in the history. This method is obsolete; you should instead use {{domxref("History.forward", "window.history.forward()")}}.</dd> + <dt>{{domxref("Window.getAttention()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Flashes the application icon.</dd> + <dt>{{domxref("Window.getAttentionWithCycleCount()")}}</dt> + <dd>{{todo("NeedsContents")}}</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.home()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Returns the browser to the home page.</dd> + <dt>{{domxref("Window.matchMedia()")}} {{gecko_minversion_inline("6.0")}}</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.openDialog()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Opens a new dialog window.</dd> + <dt>{{domxref("Window.postMessage()")}} {{Fx_minversion_inline(3)}}</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.releaseEvents()")}} {{Non-standard_inline}} {{Deprecated_inline}}</dt> + <dd>Releases the window from trapping events of a specific type.</dd> + <dt>{{domxref("Window.requestAnimationFrame()")}} {{gecko_minversion_inline("2.0")}}</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.restore()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.routeEvent()")}} {{obsolete_inline(24)}}</dt> + <dd>{{todo("NeedsContents")}}</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.setCursor()")}} {{Non-standard_inline}} (top-level XUL windows only)</dt> + <dd>Changes the cursor for the current window</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("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="Obsolete_methods">Obsolete methods</h3> + +<dl> + <dt>{{domxref("Window.showModalDialog()")}} {{obsolete_inline}}</dt> + <dd>Displays a modal dialog. <strong>This method was removed completely in Chrome 43, and Firefox 55.</strong></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> + +<div class="note"> +<p><strong>Note:</strong> Starting in {{Gecko("9.0")}}, you can now use the syntax <code>if ("onabort" in window)</code> to determine whether or not a given event handler property exists. This is because event handler interfaces have been updated to be proper web IDL interfaces. See <a href="/en-US/docs/DOM/DOM_event_handlers">DOM event handlers</a> for details.</p> +</div> + +<dl> + <dt>{{domxref("Window.onappinstalled")}}</dt> + <dd>Called when the page is installed as a webapp. See {{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")}} {{gecko_minversion_inline("6.0")}}</dt> + <dd>Called if accelerometer detects a change (For mobile devices)</dd> + <dt>{{domxref("Window.ondeviceorientation")}} {{gecko_minversion_inline("6.0")}}</dt> + <dd>Called when the orientation is changed (For mobile devices)</dd> + <dt>{{domxref("Window.ondeviceorientationabsolute")}} {{non-standard_inline}} Chrome only</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")}} {{gecko_minversion_inline("2.0")}}</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")}} {{experimental_inline}}</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")}} {{gecko_minversion_inline("1.9.2")}}</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")}} {{gecko_minversion_inline("2.0")}}</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="Constructors">Constructors</h2> + +<p>See also the <a href="/en-US/docs/DOM/DOM_Reference" title="/en-US/docs/DOM/DOM_Reference">DOM Interfaces</a>.</p> + +<dl> + <dt>{{domxref("DOMParser")}}</dt> + <dd><code>DOMParser</code> can parse XML or HTML source stored in a string into a DOM <a href="https://developer.mozilla.org/en-US/docs/DOM/document" title="document">Document</a>. <code>DOMParser</code> is specified in <a href="https://w3c.github.io/DOM-Parsing/" title="http://html5.org/specs/dom-parsing.html">DOM Parsing and Serialization</a>.</dd> + <dt>{{domxref("Window.GeckoActiveXObject")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Image")}}</dt> + <dd>Used for creating an {{domxref("HTMLImageElement")}}.</dd> + <dt>{{domxref("Option")}}</dt> + <dd>Used for creating an {{domxref("HTMLOptionElement")}}</dd> + <dt>{{domxref("Window.QueryInterface")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.StaticRange")}} {{experimental_inline}} {{readonlyinline}}</dt> + <dd>Returns a {{domxref('StaticRange.StaticRange','StaticRange()')}} constructor which creates a {{domxref('StaticRange')}} object.</dd> + <dt>{{domxref("Worker")}}</dt> + <dd>Used for creating a <a href="/en-US/docs/DOM/Using_web_workers">Web worker</a></dd> + <dt>{{domxref("Window.XMLSerializer")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.XPCNativeWrapper")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.XPCSafeJSObjectWrapper")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> +</dl> + +<h2 id="Interfaces">Interfaces</h2> + +<p>See <a href="/en-US/docs/DOM/DOM_Reference" title="/en-US/docs/DOM/DOM_Reference">DOM Reference</a></p> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("api.Window")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Working_with_windows_in_chrome_code">Working with windows in chrome code</a></li> +</ul> diff --git a/files/he/web/api/window/localstorage/index.html b/files/he/web/api/window/localstorage/index.html new file mode 100644 index 0000000000..1f423a8ef1 --- /dev/null +++ b/files/he/web/api/window/localstorage/index.html @@ -0,0 +1,82 @@ +--- +title: Window.localStorage +slug: Web/API/Window/localStorage +translation_of: Web/API/Window/localStorage +--- +<p>{{APIRef("Web Storage API")}}</p> + +<p>התכונה לקריאה בלבד <span class="seoSummary"> <strong><code>localStorage</code></strong> מאפשרת לך לגשת לאובייקט מסוג {{DOMxRef("Storage")}} עבור המקור של {{DOMxRef("Document")}}; הנתונים המאוחסנים</span><span class="seoSummary">נשמרים בכל מפגשי הדפדפן.</span> <code>localStorage</code> דומה ל-{{DOMxRef("Window.sessionStorage", "sessionStorage")}}, פרט לכך שבעוד תוקפם של הנתונים הנשמרים ב- <code>localStorage</code> אינו פג, נתונים הנשמרים ב-,<code>sessionStorage</code> נמחקים עם תום המפגש של הדף — כלומר, כשהדף נסגר.</p> + +<p>יש לציין כי נתונים הנשמרים ב-<code>localStorage</code> או ב-<code>sessionStorage</code> הם מפורטים בפרוטוקול הדף.</p> + +<p>המפתחות והערכים יביו <strong>תמיד מחרוזות</strong> (לתשומת לבך, בדומה לאובייקטים, מפתחות מטיפוס מספר שלם יומרו אוטומטית למחרוזות).</p> + +<h2 id="תחביר">תחביר</h2> + +<pre class="syntaxbox"><em>myStorage</em> = <em>window</em>.localStorage;</pre> + +<h3 id="ערך">ערך</h3> + +<p>אובייקט מסוג {{DOMxRef("Storage")}} שניתן להשתמש בו לגישה לשטח האיחסון המקומי של המקור הנוכחי.</p> + +<h3 id="חריגות">חריגות</h3> + +<dl> + <dt><code>SecurityError</code></dt> + <dd>הבקשה מפרה החלטות מדיניות, או שהמקור אינו <a href="/en-US/docs/Web/Security/Same-origin_policy#Definition_of_an_origin">a valid scheme/host/port tuple</a> (זה יכול לקרות אם המקור משתמש בסכמת (t <code>file:</code> או <code>data:</code>, למשל). לדוגמא, ייתכן שלמשתמש דפדפן המוגדר כך שישלול הרשאה לשמור נתונים כבלתי משתנים עבור מקור מסויים.</dd> +</dl> + +<h2 id="דוגמא">דוגמא</h2> + +<p>קטע הקוד הבא ניגש לאובייקט ה-{{DOMxRef("Storage")}} המקומי של המתחם הנוכחי , ומוסיף לו נתון באמצעות {{DOMxRef("Storage.setItem()")}}.</p> + +<pre class="brush: js">localStorage.setItem('myCat', 'Tom');</pre> + +<p>התחביר לקריאת נתון ה-<code>localStorage</code> הוא כדלקמן:</p> + +<pre class="brush: js">var cat = localStorage.getItem('myCat');</pre> + +<p> התחביר למחיקת נתון ה-<code>localStorage</code> הוא כדלקמן:</p> + +<pre class="brush: js">localStorage.removeItem('myCat');</pre> + +<p>התחביר למחיקת כל הנתונים ב-<code>localStorage</code> הוא כדלקמן:</p> + +<pre class="brush: js">// Clear all items +localStorage.clear(); +</pre> + +<div class="note"> +<p><strong>לתשומת לבך</strong>: נא לעיין במאמר <a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a> כדי לצפות בדוגמא השלמה.</p> +</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("HTML WHATWG", "webstorage.html#dom-localstorage", "localStorage")}}</td> + <td>{{Spec2("HTML WHATWG")}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="תאימות_דפדפנים">תאימות דפדפנים</h2> + +<div class="hidden">טבלת התאימות בדף זה נוצרה מנתונים המסודרים במבנה. אם תרצו לתרום לנתונים, אנא שלפו מ- <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> pull request ושלחו לנו בקשת משיכה.</div> + +<p>{{Compat("api.Window.localStorage")}}</p> + +<h2 id="לעיון_נוסף">לעיון נוסף</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a></li> + <li><a href="/en-US/docs/Web/API/Web_Storage_API/Local_storage">Local storage with Window.localStorage</a></li> + <li><span style="font-size: 1rem; letter-spacing: -0.00278rem;">{{DOMxRef("Window.sessionStorage")}}</span></li> +</ul> diff --git a/files/he/web/api/window/prompt/index.html b/files/he/web/api/window/prompt/index.html new file mode 100644 index 0000000000..a57610aa13 --- /dev/null +++ b/files/he/web/api/window/prompt/index.html @@ -0,0 +1,90 @@ +--- +title: Window.prompt() +slug: Web/API/Window/prompt +tags: + - דו-שיח + - הודעה + - פופ-אפ +translation_of: Web/API/Window/prompt +--- +<div>{{ApiRef("Window")}}</div> + +<p><strong><code>Window.prompt()</code></strong> - מציגה תיבת דו-שיח עם תוכן, כפתורי אישור וביטול ומאפשרת למשתמש להזין טקסט ומספרים.</p> + +<h2 id="Syntax" name="Syntax">תחביר</h2> + +<pre class="syntaxbox"><em>result</em> = window.prompt(<em>message</em>); +</pre> + +<h3 id="פרמטרים">פרמטרים</h3> + +<dl> + <dt><code>message</code> {{optional_inline}}</dt> + <dd>מחרוזת שתופיע בגוף ההודעה.</dd> +</dl> + +<h2 id="Example" name="Example">דוגמאות</h2> + +<pre class="brush: js">let sign = prompt("What's your sign?"); + +if (sign.toLowerCase() == "scorpio") { + alert("Wow! I'm a Scorpio too!"); +} + +// there are many ways to use the prompt feature +sign = window.prompt(); // open the blank prompt window +sign = prompt(); // open the blank prompt window +sign = window.prompt('Are you feeling lucky'); // open the window with Text "Are you feeling lucky" +sign = window.prompt('Are you feeling lucky', 'sure'); // open the window with Text "Are you feeling lucky" and default value "sure"</pre> + +<p> </p> + +<p>כאשר המשתמש לוחץ על לחצן האישור, הטקסט שהוזן בשדה הקלט מוחזר. במידה והמשתמש לוחץ על אישור מבלי להזין טקסט, מחרוזת ריקה מוחזרת. במידה והמשתמש לוחץ על לחצן ביטול, פונקציה זו מחזירה null.</p> + +<p>ההודעה הנ"ל מופיעה כדלקמן (בדפדפן Chrome במערכת הפעלה OS X):</p> + +<p> </p> + +<p><a href="https://mdn.mozillademos.org/files/11303/prompt.png"><img alt="prompt() dialog in Chrome on OS X" src="https://mdn.mozillademos.org/files/11303/prompt.png" style="height: 298px; width: 535px;"></a></p> + +<h2 id="Notes" name="Notes">הערות</h2> + +<p> </p> + +<p>תיבת הדו-שיח מכילה תיבת טקסט בת שורה אחת, לחצני ביטול ואישור ומחזירה את הטקסט שהמשתמש הזין בתיבת הטקסט. תיבות דו-שיח מונעות מהמשתמש גישה לממשק התוכנית עד אשר היא תיסגר.</p> + +<p>יש לשים לב שהערך המחוזר מהשתמש יהיה מחרוזת. במידה והתשובה שלו צריכה להיות מספר, יש להמיר את הערך למספר.</p> + +<p> </p> + +<pre class="brush: js">const aNumber = Number(window.prompt("Type a number", ""));</pre> + +<h2 id="Specification" name="Specification">מפרט</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', 'timers-and-user-prompts.html#dom-prompt', 'prompt()')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="See_also" name="See_also">תאימות דפדפן</h2> + + + +<p>{{Compat("api.Window.prompt")}}</p> + +<h2 id="See_also" name="See_also">ראה גם</h2> + +<ul> + <li>{{domxref("window.alert", "alert")}}</li> + <li>{{domxref("window.confirm", "confirm")}}</li> +</ul> diff --git a/files/he/web/api/xmlhttprequest/index.html b/files/he/web/api/xmlhttprequest/index.html new file mode 100644 index 0000000000..8a5c739854 --- /dev/null +++ b/files/he/web/api/xmlhttprequest/index.html @@ -0,0 +1,172 @@ +--- +title: XMLHttpRequest +slug: Web/API/XMLHttpRequest +tags: + - AJAX + - API + - Communication + - HTTP + - Interface + - NeedsTranslation + - Reference + - TopicStub + - Web + - XHR + - XMLHttpRequest +translation_of: Web/API/XMLHttpRequest +--- +<div>{{APIRef("XMLHttpRequest")}}</div> + +<p><span class="seoSummary">Use <code>XMLHttpRequest</code> (XHR) objects to interact with servers. You can retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just part of a page without disrupting what the user is doing.</span> <code>XMLHttpRequest</code> is used heavily in <a href="/en-US/docs/AJAX">Ajax</a> programming.</p> + +<p>{{InheritanceDiagram(650, 150)}}</p> + +<p>Despite its name, <code>XMLHttpRequest</code> can be used to retrieve any type of data, not just XML, and it supports protocols other than <a href="/en-US/docs/Web/HTTP">HTTP</a> (including <code>file</code> and <code>ftp</code>).</p> + +<p>If your communication needs to involve receiving event data or message data from a server, consider using <a href="/en-US/docs/Web/API/Server-sent_events">server-sent events</a> through the {{domxref("EventSource")}} interface. For full-duplex communication, <a href="/en-US/docs/Web/API/WebSockets_API">WebSockets</a> may be a better choice.</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>An {{domxref("EventHandler")}} that is called whenever the <code>readyState</code> attribute changes.</dd> + <dt id="xmlhttprequest-readystate">{{domxref("XMLHttpRequest.readyState")}} {{readonlyinline}}</dt> + <dd>Returns an <code>unsigned short</code>, the state of the request.</dd> + <dt>{{domxref("XMLHttpRequest.response")}} {{readonlyinline}}</dt> + <dd>Returns an {{domxref("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>Returns a {{domxref("DOMString")}} that contains the response to the request as text, or <code>null</code> if the request was unsuccessful or has not yet been sent.</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>Returns a {{domxref("Document")}} containing the response to the request, or <code>null</code> if the request was unsuccessful, has not yet been sent, or cannot be parsed as XML or HTML.</dd> + <dt id="xmlhttprequest-status">{{domxref("XMLHttpRequest.status")}} {{readonlyinline}}</dt> + <dd>Returns an <code>unsigned short</code> with the status of the response of the request.</dd> + <dt id="xmlhttprequest-statustext">{{domxref("XMLHttpRequest.statusText")}} {{readonlyinline}}</dt> + <dd>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 ("<code>200 OK</code>", for example).</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>Is an <code>unsigned long</code> representing the number of milliseconds a request can take before automatically being terminated.</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>Is a {{domxref("Boolean")}} that indicates whether or not cross-site <code>Access-Control</code> requests should be made using credentials such as cookies or authorization headers.</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>Is an <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer"><code>ArrayBuffer</code></a>. The response to the request, as a JavaScript typed array.</dd> + <dt>{{domxref("XMLHttpRequest.multipart")}}{{obsolete_inline("22")}}</dt> + <dd><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 <code>responseText</code> from progress events instead.</dd> +</dl> + +<h3 id="Event_handlers">Event handlers</h3> + +<p><code>onreadystatechange</code> as a property of the <code>XMLHttpRequest</code> instance is supported in all browsers.</p> + +<p>Since then, a number of additional event handlers have been implemented in various browsers (<code>onload</code>, <code>onerror</code>, <code>onprogress</code>, etc.). See <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest">Using XMLHttpRequest</a>.</p> + +<p>More recent browsers, including Firefox, also support listening to the <code>XMLHttpRequest</code> events via standard <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code> APIs in addition to setting <code>on*</code> properties to a handler function.</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>Returns all the response headers, separated by <a href="https://developer.mozilla.org/en-US/docs/Glossary/CRLF">CRLF</a>, as a string, or <code>null</code> if no response has been received.</dd> + <dt>{{domxref("XMLHttpRequest.getResponseHeader()")}}</dt> + <dd>Returns the string containing the text of the specified header, or <code>null</code> if either the response has not yet been received or the header doesn't exist in the response.</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>Sets the value of an HTTP request header. You must call <code>setRequestHeader()</code>after <a href="#open"><code>open()</code></a>, but before <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>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 <code>open()</code>.</dd> + <dt>{{domxref("XMLHttpRequest.sendAsBinary()")}}{{deprecated_inline()}}</dt> + <dd>A variant of the <code>send()</code> method that sends binary data.</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> + +<p class="hidden">The compatibility table in 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.</p> + +<p>{{Compat("api.XMLHttpRequest")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{domxref("XMLSerializer")}}: Serializing a DOM tree into XML</li> + <li>MDN tutorials covering <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> |