HTML表格通常以行为主，但有时您可能需要将其翻转，以便以列为主。这篇文章将介绍如何使用JavaScript和jQuery来实现这一目标。
简单的HTML表格
首先，我们来创建一个简单的HTML表格，其中包含三个行和三个列：
-- -------------------- ---- -------
-------
----
----------
----------
----------
-----
----
----------
----------
----------
-----
----
----------
----------
----------
-----
--------使用 JavaScript 翻转行和列
要翻转表格，我们需要在 HTML 中添加一个空元素来容纳翻转后的表格。然后，使用JavaScript遍历原始表格并将数据存储到新表格中。以下是代码：
-- -------------------- ---- -------
------ -------------------
----
----------
----------
----------
-----
----
----------
----------
----------
-----
----
----------
----------
----------
-----
--------
------ -----------------------------
--------
-- ------------
--- ------------- - -----------------------------------------
--- ---- - --------------------------
--- ---- - -----------------------------------
-- -------
--- --------------- - -------------------------------------------
--- ---- - - -- - - ----- ---- -
--- --- - -----------------------------
--- ---- - - -- - - ----- ---- -
--- ---- - ------------------
-------------- - -----------------------------------------
-
-
-- ------
----------------------------------------------------
---------在这个例子中，我们首先获取了原始表格的行数和列数，然后创建一个新表格。接下来，我们使用嵌套的循环遍历原始表格，并将每个单元格的内容复制到新表格中。最后，我们删除原始表格。
使用 jQuery 翻转行和列
如果您正在使用jQuery，则可以使用以下代码来翻转表格：
-- -------------------- ---- -------
------ -------------------
----
----------
----------
----------
-----
----
----------
----------
----------
-----
----
----------
----------
----------
-----
--------
------ -----------------------------
------- -----------------------------------------------------------
--------
-- ------------
--- ---- - ----------------- ------------
--- ---- - ----------------- -------------- ------------
-- -----------------
--- --------------- - ---------------------
--- ---- - - -- - - ----- ---- -
--- --- - ---------------
--- ---- - - -- - - ----- ---- -
--- ---- - ------------------------------------- -------------- - ----- - -- -------------- - ----- - -------------
-----------------
-
----------------------------
-
---------------------------------------------------
-- ------
-----------------------------
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------