通过jQuery里的替换方法,将文字‘食品’替换成图片
时间: 2024-03-15 16:47:06 浏览: 117
jquery实现图片切换
可以使用jQuery的`replaceWith`方法将文字替换成图片。具体步骤如下:
1. 首先,需要在HTML中添加一个空的`<span>`元素,作为图片的容器:
```html
<span id="food-image"></span>
```
2. 使用jQuery选择器选中需要替换的文字元素,并将其替换成上一步中的空`<span>`元素:
```javascript
$('body').find(':contains("食品")').replaceWith($('#food-image'));
```
3. 在JS代码中创建一个`<img>`元素,设置它的`src`属性为图片的URL,然后将它添加到上一步中的空`<span>`元素中:
```javascript
var img = $('<img>', {src: 'path/to/food-image.jpg'});
$('#food-image').append(img);
```
完整代码如下:
```javascript
$('body').find(':contains("食品")').replaceWith($('#food-image'));
var img = $('<img>', {src: 'path/to/food-image.jpg'});
$('#food-image').append(img);
```
这样就能将文字‘食品’替换成一张图片了。
阅读全文