jQuery修改表格單元格內容：text()方法賦值語法錯誤與正確用法詳解

錯誤代碼

$(this).text() = "Guanyu";  // ❌ 語法錯誤：text()是函數調用，不可賦值

正確用法

// 設置文本內容
$(this).text("Guanyu");  // ✅ 參數傳入

// 獲取文本內容
var txt = $(this).text();  // ✅ 無參調用

完整修正示例

<table id="thisTable">
    <tr><th>id</th><th>name</th><th>sex</th></tr>
    <tr><td>001</td><td>Xiaoming</td><td>man</td></tr>
    <tr><td>002</td><td>Laowang</td><td>man</td></tr>
</table>

<script>
$(function() {
    // 選中第2列(索引1)所有單元格，跳過表頭
    $("#thisTable tr:gt(0) td:eq(1)").each(function() {
        $(this).text("Guanyu");  // 正確賦值
    });
    
    // 或精確定位：第2行第2列
    $("#thisTable tr:eq(1) td:eq(1)").text("Guanyu");
});
</script>

jQuery 文本/HTML/值 三大操作對比

進階：批量更新性能優化

// ❌ 慢：每次each觸發DOM操作
$("td").each(function() { $(this).text("new"); });

// ✅ 快：構建HTML字符串一次性替換
var rows = "";
$("tr").each(function() {
    rows += "" + $(this).find("td").map(function() {
        return "new";
    }).get().join("") + "";
});
$("table").html(rows);

總結

jQuery的`text()`/`html()`/`val()`均為**函數重載**：無參獲取、有參設置。**切記：左邊不能出現函數調用**。這是JavaScript語法基本功，而非jQuery特有規則。