语法高亮，滚动条美化，设置页面调整

docs/javascript/Reference/Global_Objects/Proxy.html

@@ -13,8 +13,8 @@
 <dd>代理虚拟化的对象。它通常用作代理的存储后端。根据目标验证关于对象不可扩展性或不可配置属性的不变量（保持不变的语义）。</dd>
 </dl>
 <h2 id="Syntax" name="Syntax">语法</h2>
-<pre class="syntaxbox">let p = new Proxy(target, handler);
-</pre>
+<pre><code class="language-javascript">let p = new Proxy(target, handler);
+</code></pre>
 <h3 id="Parameters" name="Parameters">参数</h3>
 <dl>
 <dt><code>target</code></dt>
@@ -33,7 +33,7 @@
 <h2 id="示例">示例</h2>
 <h3 id="基础示例">基础示例</h3>
 <p>在以下简单的例子中，当对象中不存在属性名时，缺省返回数为<code>37</code>。例子中使用了 <a href="Reference/Global_Objects/Proxy/handler/get"><code>get</code></a>。</p>
-<pre class="brush: js">let handler = {
+<pre><code  class="language-javascript">let handler = {
     get: function(target, name){
         return name in target ? target[name] : 37;
     }
@@ -47,19 +47,19 @@ p.b = undefined;
 console.log(p.a, p.b);    // 1, undefined
 
 console.log('c' in p, p.c);    // false, 37
-</pre>
+</code></pre>
 <h3 id="无操作转发代理">无操作转发代理</h3>
 <p>在以下例子中，我们使用了一个原生 JavaScript 对象，代理会将所有应用到它的操作转发到这个对象上。</p>
-<pre class="brush: js">let target = {};
+<pre><code  class="language-javascript">let target = {};
 let p = new Proxy(target, {});
 
 p.a = 37;   // 操作转发到目标
 
 console.log(target.a);    // 37. 操作已经被正确地转发
-</pre>
+</code></pre>
 <h3 id="验证">验证</h3>
 <p>通过代理，你可以轻松地验证向一个对象的传值。这个例子使用了 <a href="Reference/Global_Objects/Proxy/handler/set"><code>set</code></a>。</p>
-<pre class="brush: js">let validator = {
+<pre><code  class="language-javascript">let validator = {
   set: function(obj, prop, value) {
     if (prop === 'age') {
       if (!Number.isInteger(value)) {
@@ -87,10 +87,10 @@ person.age = 'young';
 
 person.age = 300; 
 // 抛出异常: Uncaught RangeError: The age seems invalid
-</pre>
+</code></pre>
 <h3 id="扩展构造函数">扩展构造函数</h3>
 <p>方法代理可以轻松地通过一个新构造函数来扩展一个已有的构造函数。这个例子使用了<a href="Reference/Global_Objects/Proxy/handler/construct"><code>construct</code></a>和<code><a href="Reference/Global_Objects/Proxy/handler/apply">apply</a></code>。</p>
-<pre class="brush: js">function extend(sup,base) {
+<pre><code  class="language-javascript">function extend(sup,base) {
   var descriptor = Object.getOwnPropertyDescriptor(
     base.prototype,"constructor"
   );
@@ -125,10 +125,10 @@ Boy.prototype.sex = "M";
 var Peter = new Boy("Peter", 13);
 console.log(Peter.sex);  // "M"
 console.log(Peter.name); // "Peter"
-console.log(Peter.age);  // 13</pre>
+console.log(Peter.age);  // 13</code></pre>
 <h3 id="操作_DOM_节点">操作 DOM 节点</h3>
 <p>有时你希望切换两个不同的元素的属性或类名。下面展示了如何使用 <a href="Reference/Global_Objects/Proxy/handler/set"><code>set</code></a>。</p>
-<pre class="brush: js">let view = new Proxy({
+<pre><code  class="language-javascript">let view = new Proxy({
   selected: null
 },
 {
@@ -155,10 +155,10 @@ console.log(i1.getAttribute('aria-selected')); // 'true'
 let i2 = view.selected = document.getElementById('item-2');
 console.log(i1.getAttribute('aria-selected')); // 'false'
 console.log(i2.getAttribute('aria-selected')); // 'true'
-</pre>
+</code></pre>
 <h3 id="值修正及附加属性">值修正及附加属性</h3>
 <p>以下<code>products</code>代理会计算传值并根据需要转换为数组。这个代理对象同时支持一个叫做 <code>latestBrowser</code>的附加属性，这个属性可以同时作为 getter 和 setter。</p>
-<pre class="brush: js">let products = new Proxy({
+<pre><code  class="language-javascript">let products = new Proxy({
   browsers: ['Internet Explorer', 'Netscape']
 },
 {
@@ -195,10 +195,10 @@ console.log(products.browsers); // ['Firefox'] &lt;- ?没问题, ?得到的是
 products.latestBrowser = 'Chrome';
 console.log(products.browsers); // ['Firefox', 'Chrome']
 console.log(products.latestBrowser); // 'Chrome'
-</pre>
+</code></pre>
 <h3 id="通过属性查找数组中的特定对象">通过属性查找数组中的特定对象</h3>
 <p>以下代理为数组扩展了一些实用工具。可以看到，你可以灵活地“定义”属性，而不需要使用 <code><a href="/zh-CN/docs/JavaScript/Reference/Global_Objects/Object/defineProperties">Object.defineProperties</a></code>方法。以下例子可以用于通过单元格来查找表格中的一行。在这种情况下，target 是<code><a class="new" href="/zh-CN/docs/DOM/table.rows" rel="nofollow">table.rows</a></code>。</p>
-<pre class="brush: js">let products = new Proxy([
+<pre><code  class="language-javascript">let products = new Proxy([
   { name: 'Firefox', type: 'browser' },
   { name: 'SeaMonkey', type: 'browser' },
   { name: 'Thunderbird', type: 'mailer' }
@@ -253,10 +253,10 @@ console.log(products['Chrome']); // undefined
 console.log(products.browser); // [{ name: 'Firefox', type: 'browser' }, { name: 'SeaMonkey', type: 'browser' }]
 console.log(products.types); // ['browser', 'mailer']
 console.log(products.number); // 3
-</pre>
+</code></pre>
 <h3 id="一个完整的_traps_列表示例">一个完整的 <code>traps</code> 列表示例</h3>
 <p>出于教学目的，这里为了创建一个完整的 traps 列表示例，我们将尝试代理化一个非原生对象，这特别适用于这类操作：由 <a class="new" href="https://developer.mozilla.org/zh-CN/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support" rel="nofollow" title="https://developer.mozilla.org/zh-CN/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support">发布在 document.cookie页面上的“小型框架”</a>创建的<code>docCookies</code>全局对象。</p>
-<pre class="brush: js">/*
+<pre><code  class="language-javascript">/*
   var docCookies = ... get the "docCookies" object here:  
   https://developer.mozilla.org/zh-CN/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support
 */
@@ -303,7 +303,7 @@ alert(docCookies.my_cookie1 = "First value");
 alert(docCookies.getItem("my_cookie1"));
 
 docCookies.setItem("my_cookie1", "Changed value");
-alert(docCookies.my_cookie1);</pre>
+alert(docCookies.my_cookie1);</code></pre>
 <h2 id="规范">规范</h2>
 <table class="standard-table">
 <tbody>