C#-WebForm-★★★JQuery知识——基础知识、选择器、事件★★★
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\" οnclick=\"hehe()\"></div>";//在class="d1"的标签中最后一个 后面添加一个新的标签$(".d1:last").after(s);});</script>
不使用未来元素为新创建的标签附加点击事件
8、事件冒泡
什么是事件冒泡?就是触发一个事件后联动触发其他多个事件
阻止事件冒泡:return false;
转载于:https://www.cnblogs.com/qq450867541/p/6389271.html
C#-WebForm-★★★JQuery知识——基础知识、选择器、事件★★★相关推荐
- 公安局计算机岗位应知应会综合基础知识,事业单位考试计算机综合知识基础知识真题...
事业单位考试计算机综合知识基础知识真题 根据最新事业单位考试真题等汇总而成,事业编考试网(http:www.shizheng100.com)提供更多笔试真题.面试原创内容等. 一.单项选择题(本大题共 ...
- jQuery+Javascript基础知识汇总
jQuery介绍 jQuery是一个Javascript库,里面提供了很多快速方便操作DOM的函数(方法).学习jQuery的本质就是学习调用这些函数(方法). jQuery的入口函数 等DOM结构渲 ...
- JavaScript和jQuery的基础知识和使用
初识JavaScript 首先对于JavaScript和Java两种语言,除了语法和Java有些类似,其他部分没有任何关系.由于当时Java很火,为了推广才在名字中加了Java,也就是所谓的蹭热度. ...
- Windows_Program_Via_C_Translate_Win32编程的背景知识/基础知识_包括基本输入输出机制介绍...
Some Basic Background Story of The Win32 APIs Win32 API背景故事/背景知识 The Win32 application programming i ...
- java打印星型_初识java java入门知识 基础知识 打印各种星型图形 源代码
今天给大家带来的是初级Java基础部分的知识:包括初识Java.变量.常量.数据类型.运算符.各种选择结构.循环结构.数组等Java的基础语法部分!最后还有****循环结构的进阶****,步骤超详细, ...
- 【jQuery】基础知识梳理笔记
jQuery(网页特效) 简介: jQ是由漂亮国人-于2006年创建 jQuery是目前最流行的JavaScript程序库,它是对JavaScript对象和函数的封装 他的设计思想是write les ...
- 【jQuery】基础知识
前言 jQuery 是一个高效.精简并且功能丰富的 JavaScript 工具库.它提供的 API 易于使用且兼容众多浏览器,这让诸如 HTML 文档遍历和操作.事件处理.动画和 Ajax 操作更加简 ...
- 从零开始学jQuery(1)--基础知识
别问我为什么突然跳到jquery了-我只能说-前面一点刚看的没怎么理解-就这里比较好理解 jQuery jQuery可能很多人都有一点印象,是个比较好用的查询方式,利用jQuery可以比较容易的查询到 ...
- 从零开始学_JavaScript_系列(四)——jquery(基础,选择器,触发条件,动画,回调函数)...
jQuery语法 (1)引用jquery文件及下载库: http://jquery.com/download/ 下载 Download the compressed, production jQuer ...
最新文章
- 使用blas做矩阵乘法
- python监听鼠标事件_Python中使用PyHook监听鼠标和键盘事件实例
- 五年之后的私有云和公有云会是什么样子
- boost::throw_exception简单的测试程序
- Spring中@Resource与@Autowired、@Qualifier的用法与区别
- SwiftUI3.0封装Lottie动画库
- python僵尸进程和孤儿进程_python学习笔记——孤儿进程和僵尸进程
- kotlin 或 运算_Kotlin程序对两个数字执行算术运算
- 关于使用jquery修改hover伪标签的样式
- (52)CSS hack
- 怎样解决VirtrualBox不能新建64bit的系统的问题
- C#图片处理之:Gamma校正
- 《Ray Tracing in One Weekend》——Chapter 7: Diffuse materials
- C语言 static静态变量
- iOS 监听锁屏/解锁事件
- 计算机中汉字字库分为哪两种,常用的汉字字库有GB2312字库和GBK字库两种。 (转)...
- gif透明背景动画_ThunderSoft GIF Converter(GIF转换器)中文版分享
- 關於小米路由器老毛子Padavan固件之使用
- Windows 10 键盘快捷方式速查表
- 阿里巴巴稀疏模型训练引擎-DeepRec
热门文章
- Linux进阶之路————CentOS网络配置
- LeetCode算法入门- 4Sum -day11
- php防止跨域提交,PHP防止跨域提交表单的简单示例
- mysql 索引空间大小_查看数据库表中容量大小,表有多少记录,占多少空间以及索引的大小,以及未使用空间...
- java c s是什么_Java在C/S
- 冒泡排序--Java
- linux runqueue定义,Linux中多CPU的runqueue及抢占
- SpringBoot页面出现 Whitelabel Error Page
- inuri .php id=,php常用函数(遇见就补充)
- qdialog 返回值_QDialog exec()并获取结果值