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

jquery例子

时间:2016-04-13 18:20:29      阅读:196      评论:0      收藏:0      [点我收藏+]

标签:

jquery

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>adfasfdadfa</h1>
<p>asdfadfafdafafda</p>
<p>11111111111111</p>
<p>222222222222222</p>
<p>33333333333333333</p>
<button id="hide" type="button">隐藏</button>
<button id="show" type="button">显示</button>
<button id="toggle" type="button">显示下拉菜单</button>
<a href="http://www.baidu.com"> 百度</a>
<a href="http://www.sohu.com"> 搜狐</a>

<select>
    <option value="v1">V1</option>
    <option value="v2">V2</option>
    <option value="v3">V3</option>
</select>

<div id="div1">中华医学会</div>
<div id="div2">心医网</div>
<div id="div3">心医堂</div>


<script type="text/javascript" src="jquery-2.2.3.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#hide").click(function () {
            $("p").hide(1000);
        });
        $("#show").click(function () {
            $("p").show()
        });
    });

    $("select").change(function () {
        var selet_opt = $(this).children("option:selected").val()
        console.log(selet_opt)
        console.log($(this).text())
    })

    var  urlw1 = $("[href$=‘.baidu.com‘]");
    console.log(urlw1);

    $(document).ready(function () {
        $("#toggle").click(function () {
            $("#div1").fadeToggle();
            $("#div2").fadeToggle();
            $("#div3").fadeToggle();
        });
    });
</script>
</body>
</html>

 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .c1{
            border: red solid;
        }
        .c2{
            font-size: 50px;
        }
    </style>
</head>
<body>
<div class="c1">aaaa</div>
<div class="c1">bbbbb</div>
<div class="c1">ccccc</div>
<div class="c1">dddd</div>
<div class="c2">1111</div>
<input name=username type="checkbox" value="" />aaaa
<button type="button">点我呀</button>
<script type="text/javascript" src="jquery-2.2.3.js"></script>
<script type="text/javascript">

    $(document).ready(function () {
        $("button").click(function () {
            $(".c1").toggleClass("c2")
        })
    })

</script>
</body>
</html>

 

jquery例子

标签:

原文地址:http://www.cnblogs.com/fengjian2016/p/5387941.html

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