您的位置：首页 > Web前端 > JQuery

JQuery学习的第一天

2016-10-23 22:48 288 查看
http://jquery.com/                        下载

jquery1023_1.html

<html>

<head>

<script type="text/javascript" src="jquery-3.1.1.js"></script>

<script type="text/javascript">

$(document).ready(function(){

  $("p").click(function(){

  $(this).hide();

  });

});

</script>

</head>

<body>

<p>If you click on me, I will disappear.</p>

</body>

</html>

jquery1023_3_ShowMenu.html

<html>

<head>

<script type="text/javascript" src="../jquery-3.1.1.js"></script>

<script type="text/javascript">

document.write($("#slx").html(););

$(".level1 > a").click(function(){

 $(this).addClass("current")                                                      //给当前元素添加“current”样式

 next().show()                                             //下一个元素显示

 .parent().siblings().children("a").removeClass("current")    //父元素的同辈元素的子元素<a>移除“current”样式

 .next().hide();               //下一个元素隐藏

 return false;

 });

</script>

<style type="text/css">

  div.box {color: red;}

  ul.menu {color: red;}

  li.level1 {  font-size: 20pt;}

  ul.level2 {  font-size: 10pt;}

</style>

</head>

<body>

<div class="box">

 <ul class="menu">

  <li class="level1">

   <a href="#none">衬衫</a>

   <ul id="slx" class="level2">

    <li><a href="#none">短袖衬衫</a></li>

    <li><a href="#none">长袖衬衫</a></li>

    <li><a href="#none">短袖T恤</a></li>

    <li><a href="#none">长袖T恤</a></li>

   </ul>

  </li>

  <li class="level1">

   <a href="#none">卫衣</a>

   <ul class="level2">

    <li><a href="#none">开襟卫衣</a></li>

    <li><a href="#none">套头卫衣</a></li>

    <li><a href="#none">运动卫衣</a></li>

    <li><a href="#none">童装卫衣</a></li>

   </ul>

  </li>

  <li class="level1">

   <a href="#none">裤子</a>

   <ul class="level2">

    <li><a href="#none">短裤</a></li>

    <li><a href="#none">休闲裤</a></li>

    <li><a href="#none">牛仔裤</a></li>

    <li><a href="#none">免烫卡其裤</a></li>

   </ul>

  </li>

 </ul>

</div>

</body>

</html>


内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航