jQuery第三十四天练习

<html ><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><script src="js/jquery-3.4.1.min.js"></script><script type="text/javascript"> $(document).ready(function(){ let hdw = $('.content ul li:gt(5):not(:last)'); hdw.hide(); $('.boxmore a').click(function(){ if (hdw.is(':visible')){ hdw.hide(); $('.boxmore a span') .css('background','url(images/down.gif) no-repeat right 0') .text('显示全部资源'); $('ul li').removeClass('onebox'); } else{ hdw.show(); $('.boxmore a span') .css('background','url(images/up.gif) no-repeat right 0') .text('精简资源'); $('ul li').filter(":contains('网页布局'),:contains('PHP视频教程'),:contains('建站知识'),:contains('高清图片下载')") .addClass('onebox'); }; return false; }); });</script><style type="text/css">* { padding:0; margin:0; }body { font-size:12px; }ul { list-style-type:none; }a { text-decoration:none; color:#666; font-family:"宋体"; outline:none; }a:hover { text-decoration:underline; color:red; }.content { width:600px; margin:40px auto 0 auto; border:1px solid #ccc; text-align:center; }.container { border:5px solid #eee; padding:10px; }.content ul { padding-left:10px; }.content ul li { float:left; width:170px; margin-right:15px; line-height:20px; }.boxmore { clear:both; padding-top:10px; }.boxmore a { display:block; width:120px; line-height:24px; border:1px solid #aaa; margin:0 auto; }.boxmore a span { padding-right:15px; background:url(images/down.gif) no-repeat right 0; }.onebox a { color:red; font-weight:bold; }</style></head><body> <div>

玩酷网

轻鸟评职场技能