aboutsummaryrefslogtreecommitdiff
path: root/files/zh-cn
diff options
context:
space:
mode:
Diffstat (limited to 'files/zh-cn')
-rw-r--r--files/zh-cn/web/api/htmltablerowelement/rowindex/index.md82
1 files changed, 46 insertions, 36 deletions
diff --git a/files/zh-cn/web/api/htmltablerowelement/rowindex/index.md b/files/zh-cn/web/api/htmltablerowelement/rowindex/index.md
index ef548d318b..985e2e7074 100644
--- a/files/zh-cn/web/api/htmltablerowelement/rowindex/index.md
+++ b/files/zh-cn/web/api/htmltablerowelement/rowindex/index.md
@@ -1,58 +1,68 @@
---
title: HTMLTableRowElement.rowIndex
slug: Web/API/HTMLTableRowElement/rowIndex
+tags:
+ - API
+ - HTML DOM
+ - NeedsSpecTable
+ - Property
+ - Reference
translation_of: Web/API/HTMLTableRowElement/rowIndex
---
-<div><font><font>{{APIRef("HTML DOM")}}</font></font></div>
+{{APIRef("HTML DOM")}}
-<p><font><font>的</font></font><strong><code>HTMLTableRowElement.rowIndex</code></strong><font><font>只读属性表示一个行相对于整个位置的{{HtmlElement("table")}}。</font></font></p>
+只读属性 **`HTMLTableRowElement.rowIndex`** 用于表示元素所在行相对于整个 {{HtmlElement("table")}} 的逻辑位置。
-<p><font><font>即使{{HtmlElement("thead")}},{{HtmlElement("tbody")}}和{{HtmlElement("tfoot")}}}的元素在HTML中乱序显示,浏览器也会以正确的顺序。</font><font>因此,行数从</font></font><code>&lt;thead&gt;</code><font><font>到</font></font><code>&lt;tbody&gt;</code><font><font>,从</font></font><code>&lt;tbody&gt;</code><font><font>到</font></font><code>&lt;tfoot&gt;</code><font><font>。</font></font></p>
+即使 {{HtmlElement("thead")}}、{{HtmlElement("tbody")}} 和 {{HtmlElement("tfoot")}}} 元素在 HTML 中乱序排列,浏览器也会以正确的顺序渲染表格。因此,行号的标记顺序为:从 `<thead>` 到 `<tbody>`,再到 `<tfoot>`。
-<h2 id="句法"><font><font>句法</font></font></h2>
+## 语法
-<pre class="syntaxbox notranslate"><font><font>var </font></font><em><font><font>index</font></font></em><font><font> = </font></font><em><font><font>HTMLTableRowElement</font></font></em><font><font> .rowIndex</font></font></pre>
+```js
+var index = HTMLTableRowElement.rowIndex
+```
-<h3 id="值"><font><font>值</font></font></h3>
+### 返回值
-<p><font><font>返回该行的索引,或者</font></font><code>-1</code><font><font>如果该行不属于表的一部分,则</font><font>返回该索引</font><font>。</font></font></p>
+返回该行的索引,如果该行不属于表的一部分,则返回 `-1`。
-<h2 id="例"><font><font>例</font></font></h2>
+## 示例
-<p><font><font>本示例使用JavaScript标记表中的所有行号。</font></font></p>
+本示例使用 JavaScript 标记表中的所有行号。
-<h3 id="的HTML"><font><font>的HTML</font></font></h3>
+### HTML
-<pre class="brush: html notranslate"><font><font>&lt;表格&gt;</font></font><font><font>
-  &lt;thead&gt;</font></font><font><font>
-    &lt;tr&gt; &lt;th&gt;商品&lt;/ th&gt; &lt;th&gt;价格&lt;/ th&gt; &lt;/ tr&gt;</font></font><font><font>
-  &lt;/ thead&gt;</font></font><font><font>
-  &lt;身体&gt;</font></font><font><font>
-    &lt;tr&gt; &lt;td&gt;香蕉&lt;/ td&gt; &lt;td&gt; $ 2 &lt;/ td&gt; &lt;/ tr&gt;</font></font><font><font>
-    &lt;tr&gt; &lt;td&gt;橙色&lt;/ td&gt; &lt;td&gt; $ 8 &lt;/ td&gt; &lt;/ tr&gt;</font></font><font><font>
-    &lt;tr&gt; &lt;td&gt;顶级沙朗&lt;/ td&gt; &lt;td&gt; $ 20 &lt;/ td&gt; &lt;/ tr&gt;</font></font><font><font>
-  &lt;/ tbody&gt;</font></font><font><font>
-  &lt;脚&gt;</font></font><font><font>
-    &lt;tr&gt; &lt;td&gt;总计&lt;/ td&gt; &lt;td&gt; $ 30 &lt;/ td&gt; &lt;/ tr&gt;</font></font><font><font>
-  &lt;/ tfoot&gt;</font></font><font><font>
-&lt;/ table&gt;</font></font></pre>
+```html
+<table>
+ <thead>
+ <tr><th>商品</th> <th>价格</th></tr>
+ </thead>
+ <tbody>
+ <tr><td>香蕉</td> <td>$2</td></tr>
+ <tr><td>橘子</td> <td>$8</td></tr>
+ <tr><td>西冷牛排</td> <td>$20</td></tr>
+ </tbody>
+ <tfoot>
+ <tr><td>总计</td> <td>$30</td></tr>
+ </tfoot>
+</table>
+```
-<h3 id="的JavaScript"><font><font>的JavaScript</font></font></h3>
+### JavaScript
-<pre class="brush: js notranslate"><font><font>让行= document.querySelectorAll('tr');</font></font>
-<font><font>
-rows.forEach((row)=&gt; {</font></font><font><font>
- 让z = document.createElement(“ td”);</font></font><font><font>
- z.textContent =`(row#$ {row.rowIndex})`;</font></font><font><font>
- row.appendChild(z);</font></font><font><font>
-});</font></font></pre>
+```js
+let rows = document.querySelectorAll('tr');
-<h3 id="结果"><font><font>结果</font></font></h3>
+rows.forEach((row) => {
+ let z = document.createElement("td");
+ z.textContent = `(row #${row.rowIndex})`;
+ row.appendChild(z);
+});
+```
-<p><font><font>{{EmbedLiveSample("Example")}}</font></font></p>
+### 结果
-<h2 id="浏览器兼容性"><font><font>浏览器兼容性</font></font></h2>
+{{EmbedLiveSample("Example")}}
+## 浏览器兼容性
-
-<p><font><font>{{Compat("api.HTMLTableRowElement.rowIndex")}}</font></font></p>
+{{Compat}}