parent().children()实现同胞元素关联

来源：互联网发布：淘宝知网查重编辑：程序博客网时间：2024/05/20 07:52

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script type="text/javascript" src="js/jquery-1.12.3.js"></script><script type="text/javascript">$(function(){$(".p_one").click(function(){$(".p_two").toggleClass("red");//$(this).parent().children(".p_two").toggleClass("red");});});</script><style type="text/css">.p_one {font-size: 20px;}.p_two {font-size: 16px;}.red{color:red;}</style></head><body><ol><li><P class="p_one">click me</P><P class="p_two">color changed</P></li><li><P class="p_one">click me</P><P class="p_two">color changed</P></li><li><P class="p_one">click me</P><P class="p_two">color changed</P></li></body></html>

点击任意一个click me，出现的结果是这样

把$(".p_two").toggleClass("red");
替换成$(this).parent().children(".p_two").toggleClass("red");

点击任意第二个click me，出现的结果这样

点击任意第一个click me，出现的结果这样

实际应用

点击加入购物车后，获取对应的图片的src属性

0 0