码迷,mamicode.com
首页 > Web开发 > 详细

(8)Jquery1.8.3快速入门

时间:2018-06-03 01:01:46      阅读:176      评论:0      收藏:0      [点我收藏+]

标签:spl   技术   jquer   val   ffffff   分享   UNC   col   rip   

一、Jquery的可见性选择器:

     可见性选择器: 
1、:visable 筛选可以见的元素 
2、 :hidden 筛选不可见的元素

效果:

技术分享图片

源码:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jquery 学习1</title>
<!--  导入jquery库 -->
<script type="text/javascript" src="jquery/jquery.js"></script>
<script type="text/javascript">
$(function(){
    $("#btn1").click(function(){
        $("div:visible").css("background","#FFBBAA");
    });
    $("#btn2").click(function(){
        //show 返回jquery对象本身,继续可以调用jquery的方法
        $("div:hidden").show(1000).css("background","#FFBBAA");
    });
    $("#btn3").click(function(){
        alert($("input:hidden").val());
    });
    
})
</script>


</head>
<body>
Jquery的可见性选择器:

可见性选择器:
<br>
1、:visable 筛选可以见的元素
<br> 
2、  :hidden      筛选不可见的元素
<br>


<hr>
<button id="btn1">获取可见的div</button>
<button id="btn2">获取不可见的div</button>
<button id="btn3">获取隐藏域的值</button>


<input type="hidden" value="这是个隐藏域12">

<p>
子层
<div id="d1" style="display:none"> 孙子层d1  </div>
<span>  这是一个行信息</span>
<div>
div 孙子层
</div>
</p>
<h1>这是h1 不在div内</h1>
<hr>
<div  id="d33"> 

<h2>这是h2 在div内</h2>

子层2
<div style="background:#FFFFFF"> 孙子层2   </div>
<br/>
<span> 这是一个行信息2</span>
<div id="d2">
div 孙子层2
</div>
</div>

<br/>
<div>
这是第三个div层
</div>

<br/>

<span>这是第四个span</span>

<p>
<div style="background:#FF00FF "></div>
<div id="d5"> 这是第5个层</div>

</p>


</body>
</html>

 

(8)Jquery1.8.3快速入门

标签:spl   技术   jquer   val   ffffff   分享   UNC   col   rip   

原文地址:https://www.cnblogs.com/prefectjava/p/9127521.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!