$(".title").click(function () {
??????????????? $(this).addClass("curcol").next(".content").css("display", "block");
???????????});
<!DOCTYPE html><html><head> ???<title>jQuery事件的链式写法</title> ???<script src="jquery-3.3.1.min.js" type="text/javascript"></script> ???<style type="text/css"> ???????.iframe { ???????????border: solid 1px #888; ???????????font-size: 13px; ???????} ???????.title { ???????????padding: 6px; ???????????background-color: #EEE; ???????} ???????.content { ???????????padding: 8px 0px; ???????????font-size: 12px; ???????????text-align: center; ???????????display: none; ???????} ???????.curcol { ???????????background-color: #CCC ???????} ???</style> ???<script type="text/javascript"> ???????$(function () { ???????????$(".content").html("您好!欢迎来到jQuery的精彩世界。"); ???????????$(".title").click(function () { ???????????????$(this).addClass("curcol").next(".content").css("display", "block"); ???????????}); ???????}); ???</script></head><body> ???<div class="iframe"> ???????<div class="title">标题</div> ???????<div class="content"></div> ???</div></body></html>
当页面首次加载时,被包含的内容<div> 标记是不可见的,当用户单击主题<div> 标记时,改变自身的背景色,并将内容<div> 标记显示出来。
Jquery | 基础 | 事件的链式写法
原文地址:https://www.cnblogs.com/jj81/p/9801000.html