-
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script> <title>挑战题</title> </head> <body> <input type="button" id="btn" value="点我显示"> <div></div> <script> $(function(){ var $jsonStu=[{"name":"钢铁侠","score":"90"},{"name":"美队","score":"80"},{"name":"绿巨人","score":"85"}] $("#btn").bind("click",function(){ $.each($jsonStu,function(index,data){ $("div").append((index+1)+" 姓名："+data.name+" 战斗力："+data.score+"<br/>"); }) }) }) </script> </body> </html>查看全部
-
选项卡插件——tabs 使用选项卡插件可以将<ul>中的<li>选项定义为选项标题，在标题中，再使用<a>元素的“href”属性设置选项标题对应的内容，它的调用格式如下： $(selector).tabs({options}); selector参数为选项卡整体外围元素，该元素包含选项卡标题与内容，options参数为tabs()方法的配置对象，通过该对象还能以ajax方式加载选项卡的内容。 <div id="tabs"> <ul> <li><a href="#tabs-1">最爱吃的水果</a></li> <li><a href="#tabs-2">最喜欢的运动</a></li> </ul> <div id="tabs-1"> <p>橘子</p> <p>香蕉</p> <p>葡萄</p> <p>苹果</p> <p>西瓜</p> </div> <div id="tabs-2"> <p>足球</p> <p>散步</p> <p>篮球</p> <p>乒乓球</p> <p>骑自行车</p> </div> </div> </div> <script type="text/javascript"> $(function () { $("#tabs").tabs({ //设置各选项卡在切换时的动画效果 fx: { opacity: "toggle", height: "toggle" }, event: "mousemove" //通过移动鼠标事件切换选项卡 }) }); </script>查看全部
-
面板折叠插件——accordion 面板折叠插件可以实现页面中指定区域类似“手风琴”的折叠效果，即点击标题时展开内容，再点另一标题时，关闭已展开的内容，调用格式如下： $(selector).accordion({options}); 其中，参数selector为整个面板元素，options参数为方法对应的配置对象。 <div id="divtest"> <div id="accordion"> <h3> <a href="#">白富美</a></h3> <p>咱们结婚吧!</p> <h3> <a href="#">土豪族</a></h3> <p>咱们交个朋友吧!</p> </div> </div> <script type="text/javascript"> $(function () { $("#accordion").accordion(); }); </script> 注意： （1）要添加JQ的UI CSS文件 <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css"> （2）html的结构<a>标签的href等于#查看全部
-
要让ul暂时不予以显示 可以设置 display:none;查看全部
-
$("li[title='蔬菜']")，li后面没有冒号：查看全部
-
eq()行，contains(),‘text’查看全部
-
$("p + label")紧接下面一个元素查看全部
-
$("div>label")div下的子元素label，$("div label")div下所有的label查看全部
-
拖曳排序插件——sortable 拖曳排序插件的功能是将序列元素（例如<option>、<li>）按任意位置进行拖曳从而形成一个新的元素序列，实现拖曳排序的功能，它的调用格式为： $(selector).sortable({options}); selector参数为进行拖曳排序的元素，options为调用方法时的配置对象 $(function () { $("ul").sortable({ delay:2, opacity:0.35 }); }); appendTo axis cancel connectWith containment cursor cursorAt delay disabled distance dropOnEmpty forceHelperSize forcePlaceholderSize grid handle helper items opacity placeholder revert scroll scrollSensitivity scrollSpeed tolerance zIndex查看全部
-
$(".red,.green")选择多个元素时，用逗号隔开查看全部
-
$("#a1").attr("href","www.imooc.com"); var $url = $("#a1").attr("href"); $("#tip").html($url);查看全部
-
$("div *")或者div下所有的子元素查看全部
-
.html()设置内容查看全部
-
jqzoom(图片放大镜) <script type="text/javascript"> $(function () { ? //绑定图片放大插件jqzoom zoomWidth: 123, //小图片所选区域的宽 zoomHeight: 123, //小图片所选区域的高 zoomType: 'reverse' //设置放大镜的类型 }); }); </script>查看全部
-
attr()方法的功能是设置或获取元素的某项属性值查看全部
举报
0/150
提交
取消