jQuery标签替换函数replaceWith()的使用例子
作者:bea
replaceWith简单使用 jQuery中,有一个强大的替换函数replaceWith(),使用非常简单,如: 页面有如下p标签 把所有p标签替换为“##” $('p').replaceWith('##'); 执行后的结果: 替换标签 利用这个replaceWith,我们可以把所有p标签替换为b标签,内容不变: $('p').each(function(){$(this).replaceWith('<b>'+$(this).html()+'<
replaceWith简单使用
jQuery中,有一个强大的替换函数replaceWith(),使用非常简单,如:
页面有如下p标签
把所有p标签替换为“##”
$('p').replaceWith('##');
执行后的结果:
替换标签
利用这个replaceWith,我们可以把所有p标签替换为b标签,内容不变:
$('p').each(function(){
$(this).replaceWith('<b>'+$(this).html()+'</b>');
});
结果
这就替换了!
多语言网站可以利用这个函数轻松完成
如果你开发的是一个多语言的网站,甚至可以利用这个特性,比如,在你需要翻译的文字上加上i标签,然后遍历翻译替换。
假如页面dom结构如下:
我们要把页面中的i标签里的文本给翻译,页面中有i标签的分别是苹果、电脑。于是我们实现需要一个翻译库:
var translate = {
'苹果' : 'apple',
'电脑' : 'PC'
};
然后我可以这样执行翻译替换
$('i').each(function(){
$(this).replaceWith(translate[$(this).html()]);
});
执行后效果:
页面效果:
有用 | 无用
jQuery中,有一个强大的替换函数replaceWith(),使用非常简单,如:
页面有如下p标签
把所有p标签替换为“##”
$('p').replaceWith('##');
执行后的结果:
替换标签
利用这个replaceWith,我们可以把所有p标签替换为b标签,内容不变:
$('p').each(function(){
$(this).replaceWith('<b>'+$(this).html()+'</b>');
});
结果
这就替换了!
多语言网站可以利用这个函数轻松完成
如果你开发的是一个多语言的网站,甚至可以利用这个特性,比如,在你需要翻译的文字上加上i标签,然后遍历翻译替换。
假如页面dom结构如下:
我们要把页面中的i标签里的文本给翻译,页面中有i标签的分别是苹果、电脑。于是我们实现需要一个翻译库:
var translate = {
'苹果' : 'apple',
'电脑' : 'PC'
};
然后我可以这样执行翻译替换
$('i').each(function(){
$(this).replaceWith(translate[$(this).html()]);
});
执行后效果:
页面效果:
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- 原生javascript实现拖动元素示例代码
- 使用text方法获取Html元素文本信息示例
- textarea不能通过maxlength属性来限制字数的解决方法
- 超级好用的jQuery圆角插件 Corner速成
- Html5的placeholder属性(IE兼容)实现代码
- 通过js为元素添加多项样式,浏览器全兼容写法
- 原生js仿jq判断当前浏览器是否为ie,精确到ie6~8
- 原生js实现复制对象、扩展对象 类似jquery中的extend()方法
- ZeroClipboard插件实现多浏览器复制功能(支持firefox、chrome、ie6)
- 仿百度联盟对联广告实现代码
- jQuery针对各类元素操作基础教程
- jQuery事件用法实例汇总
- laytpl 精致巧妙的JavaScript模板引擎
- jQuery动画特效实例教程
- jQuery实用函数用法总结
- jQuery实现异步获取json数据的2种方式
- 原生javascript实现的分页插件pagenav
- JavaScript判断变量是对象还是数组的方法
- 分享一个自己动手写的jQuery分页插件