JQuery 与 JS 之间的转换

  将JQuery转换为JS —— get(0)  例如:alert( $("#d1").get(0).offsetwidth );

  将JS 转换为JQuery —— $(" ")  例如:$("#d1").click(function(){});

1、什么是JQuery?  

它就是一套JS方法包,也叫JS框架或前端框架

Node.js 是一个开发环境

2、JQuery的用法:文件引用到aspx网页中前台代码中

3、基本选择器:

$("#d1")  ID 选择器

$(".cla")  Class选择器

$("div")  标签名选择器

$("#d1,#d2,#d3,#d4")  并列选择器,用“,”隔开

$(".cla c2")  后代选择器,用空格隔开

4、过滤选择器:

基本过滤

  首尾过滤:第一个和最后一个是指在代码中第一次出现的标签不管其位置如何

    $(".c1:first")  获取class="c1"的标签的第一个

    $(".c1:last")  获取class="c1"的标签的最后一个

  等于某个索引

    $(".d1:eq(x)")  class="d1"的标签中索引为x的标签

    $(".d1").eq(x).click({});

  不等于某个索引

    $(".d1:gt(索引值)")  class="d1"的标签中索引大于x的标签

    $(".d1:lt(索引值)")  class="d1"的标签中索引小于x的标签

    $(".d1:not(选择器)")  class="d1"的标签中不包括(选择器)的其他所有

      例如:$(".d1:not(.d1:eq(2))")  class="d1"的所有标签中,除索引为2的其他的所有标签

  奇偶过滤

    $(".d1:odd")  class="d1"的标签中索引为奇数的标签

    $(".d1:even")  class="d1"的标签中索引为偶数的标签

  属性过滤

    属性名  $(".d1[hehe]")  class="d1"的标签中含有“hehe”属性的所有标签

    属性值  $(".d1[hehe=wqf]") 或 $(".d1[hehe!=wqf]")  class="d1"的标签中含有“hehe”属性的所有标签中 属性值等于或不等于某个值的标签

  内容过滤

    内容过滤  $(".d1:contains(字符串)")  class="d1"的标签中内容包含字符串的所有标签

    子元素过滤  $(".d1:has(标签名)")  class="d1"的标签中内容包含某标签子元素的所有标签

5、JQuery的事件是把JS中的事件去掉on,比如JS中“onclick”、“ondblclick”,JQuery则为“click”、“dblclick”

  例如:$(".d1").click( function () {} );

6、复合事件

  hover  鼠标悬浮时和移出时事件

    $(".d1").hover( function () {} , function () {});

  toggle  点击事件,循环执行其中方法,允许其中有多种方法

    $(".d1").toggle ( function () {} , function () {}  );

7、未来元素

  在网页加载之后,再创建出来的元素成为未来元素  live:未来元素  参数1:未来元素的事件  参数2:事件的内容

  $(".d1").live( "click" , function () {} );  未来元素class="d1"的标签的点击事件

  如何不使用未来元素给新建的标签附加点击事件?

<script>

    function hehe() {
alert("aa");
}; //div点击事件
$(".d1").click(function () {
hehe();
}); //点击按钮创建新的div,附加点击事件
$("#btn1").click(function () {
var s = "<div class=\"d1\" onclick=\"hehe()\"></div>";
//在class="d1"的标签中最后一个 后面添加一个新的标签
$(".d1:last").after(s);
}); </script>

不使用未来元素为新创建的标签附加点击事件

8、事件冒泡

  什么是事件冒泡?就是触发一个事件后联动触发其他多个事件

  阻止事件冒泡:return false;

C#-WebForm-★★★JQuery知识——基础知识、选择器、事件★★★的更多相关文章

  1. Windows_Program_Via_C_Translate_Win32编程的背景知识/基础知识_包括基本输入输出机制介绍

    Some Basic Background Story of The Win32 APIs Win32 API背景故事/背景知识 The Win32 application programming i ...

  2. 【JavaScript框架封装】实现一个类似于JQuery的基础框架、事件框架、CSS框架、属性框架、内容框架、动画框架整体架构的搭建

    /* * @Author: 我爱科技论坛 * @Time: 20180715 * @Desc: 实现一个类似于JQuery功能的框架 * V 1.0: 实现了基础框架.事件框架.CSS框架.属性框架. ...

  3. jQuery入门基础(选择器)

    一.jQuery简介 jQuery 是一个 JavaScript 库. jQuery 极大地简化了 JavaScript 编程. jQuery 库位于一个 JavaScript 文件中,其中包含了所有 ...

  4. 【jquery】基础知识

    jquery简介 1 jquery是什么 jquery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入其team. jQuery是继prototype之后 ...

  5. jquery 的基础知识,以及和Javascript的区别

    想到之前所学的javascript 我们会想到这几个方面:找元素: 操作内容: 操作属性:操作样式:统一操作元素: jquery 也是从这几个方面来学习的. <head> <meta ...

  6. jQuery笔记——基础知识

    jQuery是一个JavaScript库,它通过封装原生的JavaScript函数得到一整套定义好的方法.在jQuery程序中,不管是页面元素的选择.内置的功能函数,都是美元符号“$”来起 始的.而这 ...

  7. 【JQuery基础知识/statusCode(状态码)】---初学者必备

    今天,给大家分享一下JQuery的基础知识,简单介绍一下JQuery高级_Ajax,和我们常见的一些statusCode(状态码)~~~ 如果存在错误,请大家多多指正留言~小女子在此谢过! 一.JQu ...

  8. JAVA面试题集之基础知识

                           JAVA面试题集之基础知识 基础知识:  1.C 或Java中的异常处理机制的简单原理和应用. 当JAVA程序违反了JAVA的语义规则时,JAVA虚拟机就 ...

  9. JQuery基础知识==jQuery选择器

    选择器是jQuery的基础,在jQuery中,对事件处理.遍历DOM和Ajax操作都依赖于选择器 1. CSS选择器 1.1 CSS是一项出色的技术,它使得网页的结构和表现样式完全分离.利用CSS选择 ...

随机推荐

  1. 岛屿的个数12 · Number of Islands12

    [抄题]: 给一个01矩阵,求不同的岛屿的个数. 0代表海,1代表岛,如果两个1相邻,那么这两个1属于同一个岛.我们只考虑上下左右为相邻. [ [1, 1, 0, 0, 0], [0, 1, 0, 0 ...

  2. code3289 花匠

    题目大意是求一个最长的抖动的子序列 题解中有一个大神写下了这样的代码: #include<cstdio> ,b=,x,y; int mmax(int a,int b) { if(a> ...

  3. [Java] 通过XPath获取XML中某个节点的属性

    /** * Get PA Url * @author jzhang6 * @return url */ public String getPAUrl(){ String PAUrl = "& ...

  4. js的prototype(2)

    1 原型法设计模式 在.Net中可以使用clone()来实现原型法 原型法的主要思想是,现在有1个类A,我想要创建一个类B,这个类是以A为原型的,并且能进行扩展.我们称B的原型为A. 2 javasc ...

  5. Oracle查看字符集

    select * from nls_database_parameters where parameter like 'NLS%CHARACTERSET';

  6. arean.c

    glibc-2.14中的arean.c源代码,供研究malloc和free实现使用: /* Malloc implementation for multiple threads without loc ...

  7. SDWebImage从缓存中获取图片

      if ([[SDImageCache sharedImageCache] imageFromKey:sort.imageUrl]) {         [cell.photoImageView s ...

  8. [Selenium With C#基础教程] Lesson-03 超级链接

    作者:Surpassme 来源:http://www.jianshu.com/p/83809943e751 声明:本文为原创文章,如需转载请在文章页面明显位置给出原文链接,谢谢. 超级链接或链接是We ...

  9. POJ1751 Highways 2017-04-14 15:46 70人阅读 评论(0) 收藏

    Highways Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 14819   Accepted: 4278   Speci ...

  10. [记]Centos下流量统计使用记录

    因为最近要进行centos流量统计,需求是想针对tomcat进行针对性的上下行流量时段统计及汇总,找了很多资料及命令,要么是可以针对进程的但是没有汇总,要么是有汇总但是不针对进程. 所以只能混合几个命 ...