zoukankan      html  css  js  c++  java
  • JQuery 快速入门教程二

    一、jQuery 语法:$(selector).action()

    • 美元符号定义 jQuery
    • 选择符(selector)“查询”和“查找” HTML 元素
    • jQuery 的 action() 执行对元素的操作

    示例

    $(this).hide() - 隐藏当前元素

    $("p").hide() - 隐藏所有段落

    $("p.test").hide() - 隐藏所有 class="test" 的段落

    $("#test").hide() - 隐藏所有 id="test" 的元素

     

    1、$(this).hide() 演示 jQuery hide() 函数,隐藏当前的 HTML 元素。

    <html>
    <head>
    <script type="text/javascript" src="jquery-1.7.1.min.js"></script> 
    <script type="text/javascript">
    $(document).ready(function(){
      $("button").click(function(){
      $(this).hide();
    });
    });
    </script>
    </head>
    
    <body>
    <button type="button">Click me</button>
    </body>
    </html>
    

     2、  jQuery hide() 函数,隐藏 id="test" 的元素。

    $("#test").hide();

    <html>
    <head>
    <script type="text/javascript" src="jquery-1.7.1.min.js"></script> 
    <script type="text/javascript">
    $(document).ready(function(){
      $("button").click(function(){
      $("#myID").hide();
    });
    });
    </script>
    </head>
    
    <body>
    <p>If you click on me, I will dispperar</p>
    <p id="myID">This is a paragraph.</p>
    <p>This is another paragraph.</p>
    <button type="button">Click me</button>
    </body>
    </html>
    

     3、$("p").hide() 表示隐藏所有 <p> 元素。

     4、 $(".test").hide()表示隐藏所有 class="test" 的元素。

    <html>
    <head>
    <script type="text/javascript" src="jquery-1.7.1.min.js"></script> 
    <script type="text/javascript">
    $(document).ready(function(){
      $("button").click(function(){
      $(".myClass").hide();
    });
    });
    </script>
    </head>
    
    <body>
    <p>If you click on me, I will dispperar</p>
    <p id="myID">This is a paragraph.</p>
    <p class="myClass">This is another paragraph.</p>
    <button type="button">Click me</button>
    </body>
    </html>
    

     二、所有的JQuery函数都位于下面的函数中

    $(document).ready(function(){
    --- jQuery functions go here ----

    });

     
  • 相关阅读:
    hdu 4123 树形dp+rmq
    POJ 2761 Feed the dogs 求区间第k大 划分树
    hdu 4585 shaolin 平衡树
    *hdu 4616 Game 树形DP
    hdu 5379 Mahjong tree 树形DP入门
    CF 581F Contest Page 树形DP
    hdu 2778 LCR 模拟题
    hdu 2896 病毒侵袭 AC自动机
    hdu 2222 Keywords Search AC自动机模板题
    透过c的编程原则,来规范自己现在的一些编程习惯
  • 原文地址:https://www.cnblogs.com/linlf03/p/2309603.html
Copyright © 2011-2022 走看看