jquery替换方法将table 中第二行th的文字替换成图片显示

可以使用jQuery中的`.find()`方法来选择表格中的第二行（即索引为1的行），然后再使用`.find()`方法选择该行中的第一个`<th>`元素，最后使用`.html()`方法将该`<th>`元素的文本内容替换为图片。具体实现如下：

HTML代码：

<table>
  <tr>
    <th>姓名</th>
    <th>年龄</th>
    <th>性别</th>
  </tr>
  <tr>
    <th>John</th>
    <th>Doe</th>
    <th>Male</th>
  </tr>
  <tr>
    <th>Jane</th>
    <th>Doe</th>
    <th>Female</th>
  </tr>
</table>

jQuery代码：

// 通过选择器获取表格中的第二行，并选择其中的第一个<th>元素
var thNode = $('table tr:eq(1)').find('th:eq(0)');

// 创建一个图片节点
var imgNode = $('<img src="image.png">');

// 将<th>元素的文本内容替换成图片
thNode.html(imgNode);

上述代码会将表格中第二行第一个`<th>`元素的文本替换成一张名为`image.png`的图片。你可以根据需要修改图片的路径和名称。

相关问题

jquery替换方法，将table中第一个tr中第二个th替换成图片显示

可以使用jQuery中的`.find()`方法来选择表格中的第一个行（即索引为0的行），然后再使用`.find()`方法选择该行中的第二个`<th>`元素，最后使用`.html()`方法将该`<th>`元素的文本内容替换为图片。具体实现如下：

HTML代码：

<table>
  <tr>
    <th>姓名</th>
    <th>年龄</th>
    <th>性别</th>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>Male</td>
  </tr>
  <tr>
    <td>Jane</td>
    <td>Doe</td>
    <td>Female</td>
  </tr>
</table>

jQuery代码：

// 通过选择器获取表格中的第一个行，并选择其中的第二个<th>元素
var thNode = $('table tr:first-child').find('th:nth-child(2)');

// 创建一个图片节点
var imgNode = $('<img src="image.png">');

// 将<th>元素的文本内容替换成图片
thNode.html(imgNode);

上述代码会将表格中第一个行第二个`<th>`元素的文本替换成一张名为`image.png`的图片。你可以根据需要修改图片的路径和名称。

通过jQuery里的替换方法，将文字‘食品’替换成图片

可以使用jQuery的`replaceWith`方法将文字替换成图片。具体步骤如下：

1. 首先，需要在HTML中添加一个空的`<span>`元素，作为图片的容器：

<span id="food-image"></span>

2. 使用jQuery选择器选中需要替换的文字元素，并将其替换成上一步中的空`<span>`元素：

$('body').find(':contains("食品")').replaceWith($('#food-image'));

3. 在JS代码中创建一个`<img>`元素，设置它的`src`属性为图片的URL，然后将它添加到上一步中的空`<span>`元素中：

var img = $('<img>', {src: 'path/to/food-image.jpg'});
$('#food-image').append(img);

完整代码如下：

$('body').find(':contains("食品")').replaceWith($('#food-image'));
var img = $('<img>', {src: 'path/to/food-image.jpg'});
$('#food-image').append(img);

这样就能将文字‘食品’替换成一张图片了。