大橙子网站建设,新征程启航
为企业提供网站建设、域名注册、服务器等服务
思路:使用hide()隐藏所有元素→使用选择器first,first-child,nth-child(1)等获取第一个元素→使用show()显示第一个元素。
达日网站制作公司哪家好,找创新互联!从网页设计、网站建设、微信开发、APP开发、成都响应式网站建设公司等网站项目制作,到程序开发,运营维护。创新互联2013年开创至今到现在10年的时间,我们拥有了丰富的建站经验和运维经验,来保证我们的工作的顺利进行。专注于网站建设就选创新互联。
实例演示如下:
1、HTML结构
div id="test"
liGlen/li
liTane/li
liJohn/li
liRalph/li
/div
2、jquery代码
$(function(){
$("#test li").hide();
$("#test li").eq(0).show();
});
3、显示效果
………………竟然有人问这种问题………………
举例
html
head
script type="text/javascript" src="/jquery/jquery.js"/script
script type="text/javascript"
$(document).ready(function(){
$(".btn1").click(function(){
$("p").hide();
});
$(".btn2").click(function(){
$("p").show();
});
$(".btn3").click(function(){
$("p").toggle();
});
});
/script
/head
body
pThis is a paragraph./p
button class="btn3"切换/button
button class="btn1"Hide/button
button class="btn2"Show/button
/body
/html
授之以渔
1、新建HTML文件。
2、引入jquery.min.js文件。
3、创建HTML内容。
4、用jquery创建点击事件,点击隐藏按钮,p内容隐藏
5、用jquery创建点击事件,点击显示按钮,p内容显示。
6、预览如图当点击隐藏按钮,p内容隐藏。
7、当点击显示按钮,p内容显示。