zoukankan      html  css  js  c++  java
  • JQuery

    JQuery概念:
    JQuery是一个框架,用原生JavaScript代码封装成一个函数库,可根据需求使用相应语法调用;(类似于Java类中封装方法)

    JQuery的导入:
    直接在html文件的head部分添加(<script src="js/jquery.min.js"></script>),需写在最前面否则在自定义JS文件中会找不到jQuery;

    jQuery选择器概述:
    选择器是jQuery的核心,且jQuery选择器与css选择器语法类似;

    id选择器:$( "# ID名 " );
    类选择器:$( ". 类名 " );
    元素选择器:$( " 元素名 " );
    组选择器:$( " 元素名,. 类名,# ID名 。。。" );
    后代选择器:$( " 父元素名 子元素名 " );
    子选择器:$( " 父元素名 > 子元素名 " );
    选择指定父元素下的指定子元素
    第一个子元素:后代选择器:$( " 父元素名 子元素名:first " );
    最后一个子元素:后代选择器:$( " 父元素名 子元素名:last " );
    not 选择器(多用于复选框)
    选中选择器:$( " 元素名:(checked) " );
    未选中选择器:$( " 元素名:not(:checked) " );
    偶数选择器:$( " 父元素名 子元素名:even" );
    奇数选择器:$( " 父元素名 子元素名:odd" );
    eq选择器:$( " 父元素名 子元素名:eq(索引)" );<选择指定索引元素>
    gt选择器:$( " 父元素名 子元素名:gt(索引)" );<选择大于指定索引的元素>

    JavaScript文件中事件绑定方式:
    $(function(){
    $("button").click(function() {
    alert("JavaScript第一种绑定方式")
    });
    })

    $(function(){
    $("button").click(method);
    })
    function method(){
    alert("JavaScript第二种绑定方式")
    }

    HTML文件中事件绑定方式:
    <script >
    $(function(){
    $("button").click(function() {
    alert("HTML第一种绑定方式")
    });
    })
    </script>

    <script >
    $(function(){
    $("button").click(method);
    })
    function method(){
    alert("HTML第二种绑定方式")
    }
    </script>


    多元素绑定同一事件案例
    $(function(){
    $("button").click(removeById);
    })
    //定义删除函数
    function removeById(){
    //弹窗确认是否删除
    var flag=window.confirm("是否删除数据");
    //返回值为false直接结束函数
    if (!flag) {
    return ;
    };
    //获取需要删除数据的编号
    //$(this):表示触发函数的元素
    //$(this).parents("tr"):获取该元素的父类元素
    //$(this).parents("tr").find("td:eq(0)"):根据父类元素查询对应编号所在的元素
    //$(this).parents("tr").find("td:eq(0)").text():获取元素内部文本内容
    var empno = $(this).parents("tr").find("td:eq(0)").text();
    var parentTr=$(this).parents("tr");
    $(this).parents("tr").fadeOut('slow', function() {
    //移除已被删除的元素
    parentTr.remove();
    console.log($("tr").length);
    });

  • 相关阅读:
    js给redio设置哪一个被选中
    问候struts2升级的新版本2.5
    图片上传与显示时候的路径问题
    Json,String,Map之间的转换
    springboot之web
    关于struts2中出现的漏洞,如何测试解决
    Table-valued functions and Scalar-valued functions in SQL Server
    Using system view: sys.sysprocesses to check SqlServer's block and deadlock
    利用sys.sysprocesses检查SqlServer的阻塞和死锁
    SQLSERVER加密解密函数(非对称密钥 证书加密 对称密钥)
  • 原文地址:https://www.cnblogs.com/hasagi/p/10792723.html
Copyright © 2011-2022 走看看