zoukankan      html  css  js  c++  java
  • JQuery笔记

    <head>
    <script src="jquery.js"></script>
    </head>

    在 HTML5 中,不必在 <script> 标签中使用 type="text/javascript"。

    -----------------------------------------------------------------------------------

    <h2 id="test">This is a heading</h2>
    <p>This is a paragraph.</p>
    <p id="test">This is another paragraph.</p>

    <script>
    $(document).ready(function(){
      $("button").click(function(){
        $("p").hide();
      });
    });
    </script>

    注意,上面的html中h2和p拥有相同的id “test",这时我们在点击按钮button的时候,只会隐藏掉h2元素,p元素保持不动,可以看出,理论上id是不应该重复的。

    <h2 class="test">This is a heading</h2>
    <p class="test">This is a paragraph.</p>
    <p>This is another paragraph.</p>
    <button type="button">Click me</button>

    <script type="text/javascript">
    $(document).ready(function()
    {
      $("button").click(function()
      {
      $(".test").hide();
      });
    });
    </script>

    而在上面的这段代码中,h2和p均会被隐藏,因为h2和p元素均属于”test"类

    以上,两点形成对比,也是符合逻辑的,id作为标识一般不允许重复,而多个不同的html元素可以同时包含在一个类中。

    -----------------------------------------------------------------------------------

    jQuery 语法

    jQuery 语法是为 HTML 元素的选取编制的,可以对元素执行某些操作。

    基础语法是:$(selector).action()

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

    -----------------------------------------------------------------------------------

    有关于选择器

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

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

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

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

  • 相关阅读:
    lnmp配置https,配置pathinfo---------记录学习
    微信公众号第三方授权登录->自带源码-->自己记录学习
    二维数组排序
    php 图片,文件下载
    PHP最彻底的退出登录,清除session、cookie的代码
    php 安装redis扩展
    2020系统综合实践(七)第15组
    2020系统综合实践(六)第15组
    2020系统综合实践(五)
    2020系统综合实践(四)
  • 原文地址:https://www.cnblogs.com/SharpL/p/4576486.html
Copyright © 2011-2022 走看看