diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/zh-cn/web/api/storage/getitem | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/zh-cn/web/api/storage/getitem')
-rw-r--r-- | files/zh-cn/web/api/storage/getitem/index.html | 131 |
1 files changed, 131 insertions, 0 deletions
diff --git a/files/zh-cn/web/api/storage/getitem/index.html b/files/zh-cn/web/api/storage/getitem/index.html new file mode 100644 index 0000000000..11869d49e2 --- /dev/null +++ b/files/zh-cn/web/api/storage/getitem/index.html @@ -0,0 +1,131 @@ +--- +title: Storage.getItem() +slug: Web/API/Storage/getItem +translation_of: Web/API/Storage/getItem +--- +<p>{{APIRef("Web Storage API")}}</p> + +<p><code>getItem()</code> 作为 {{domxref("Storage")}} 接口的方法,接受一个键名(key name)作为参数,并返回对应键名的值(key's value)。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">var <em>aValue</em> = <em>storage</em>.getItem(<em>keyName</em>); +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><em><code>keyName</code></em></dt> + <dd>一个包含键名的 {{domxref("DOMString")}}。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个 {{domxref("DOMString")}},键名对应的值。如果键名不存在于存储中,则返回 <code>null</code>。</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'); + + 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>备注:</strong>一个实际的例子 <a href="https://github.com/mdn/web-storage-demo">Web Storage Demo</a>。</p> +</div> + +<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('Web Storage', '#dom-storage-getitem', 'getItem()')}}</td> + <td>{{Spec2('Web Storage')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</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 (WebKit)</th> + </tr> + <tr> + <td>localStorage</td> + <td>4</td> + <td>3.5</td> + <td>8</td> + <td>10.50</td> + <td>4</td> + </tr> + <tr> + <td>sessionStorage</td> + <td>5</td> + <td>2</td> + <td>8</td> + <td>10.50</td> + <td>4</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>2.1</td> + <td>{{ CompatUnknown }}</td> + <td>8</td> + <td>11</td> + <td>iOS 3.2</td> + </tr> + </tbody> +</table> +</div> + +<p>各浏览器支持的 localStorage 和 sessionStorage 容量不同。测试页面:<a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">detailed rundown of all the storage capacities for various browsers</a>。</p> + +<div class="note"> +<p><strong>Note: </strong>since iOS 5.1, Safari Mobile stores localStorage data in the cache folder, which is subject to occasional clean up, at the behest of the OS, typically if space is short.</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<p><a href="/zh-CN/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">使用 Web Storage API</a></p> |