本文实例讲述了jQuery动态移除和添加背景图片的方法。分享给大家供大家参考,具体如下:
利用jQuery移除和添加图片
1,样式
& lt;风格类型=" text/css "比;
.changeImage {
背景:url(图片/right.png)没有重演中心;
}
& lt;/style>
之前
2, JS
(1)在改变标签的样式,需要移除之前添加的样式
$(" #标签tr”); (td) .removeClass (“changeImage”);
之前
(2)添加样式
$(" #标签tr”); (td) .addClass (“changeImage”);
之前
<强>附:完整示例演示:
& lt; !DOCTYPE html>
& lt; html>
& lt; head>
& lt;元charset=" utf - 8 "/比;
& lt; title> jQuery移除和添加图片& lt;/title>
& lt;脚本type=" text/javascript " src=" https://www.yisu.com/zixun/jquery-1.7.2.min.js "祝辞& lt;/script>
& lt;风格类型=" text/css "比;
.changeImage {
背景:url(图片/arrow1.gif)没有重演中心;
}
& lt;/style>
& lt; script>
函数removeimg () {
$(" #标签tr”); (td) .removeClass (“changeImage”);
}
函数碱(){
$(" #标签tr”); (td) .addClass (“changeImage”);
}
& lt;/script>
& lt;/head>
& lt; body>
边境=1 & lt;表id=把∠羁ā北?
& lt; tr> & lt; td>年& lt;/td> & lt; td>制造商& lt;/td> & lt; td>型号& lt;/td> & lt; td>说明& lt;/td> & lt; td>价值& lt;/td> & lt;/tr>
& lt; tr> & lt; td> 1997 & lt;/td> & lt; td> Ford & lt; td> E350 & lt; td>“ac & lt; td>abs & lt; td>月亮”& lt;/td> & lt; td> 3000.00 & lt;/td> & lt;/tr>
& lt; tr> & lt; td> 1999 & lt;/td> & lt; td> Chevy & lt; td>“风险”“加长版”“& lt;/td> & lt; td>”“& lt;/td> & lt; td> 4900.00 & lt;/td> & lt;/tr>
& lt; tr> & lt; td> 1999 & lt;/td> & lt; td> Chevy & lt; td>“风险”“扩展Edition & lt; td>非常大”“”& lt;/td> & lt; td>”“& lt;/td> & lt; td> 5000.00 & lt;/td> & lt;/tr>
& lt; tr> & lt; td> 1996 & lt;/td> & lt; td> Jeep & lt; td>大Cherokee & lt; td>“必须出售! & lt;/td> & lt;/tr>
& lt; tr> & lt; td> air & lt; td>月亮roof & lt; td>加载”& lt;/td> & lt; td> 4799.00 & lt;/td> & lt;/tr>
& lt;/table>
& lt;输入类型="按钮" value=" https://www.yisu.com/zixun/添加样式”/比;
& lt;输入类型="按钮" value=" https://www.yisu.com/zixun/删除样式”/比;
& lt;/body>
& lt;/html>
之前
更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery图片操作技巧大全》,《jQuery表格(表)操作技巧汇总》、《jQuery切换特效与技巧总结》,《jQuery扩展技巧总结》,《jQuery常用插件及用法总结》,《jQuery常见经典特效汇总》及《jQuery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
