jquery name选择器_jquery笔记

jQuery

48c1d9d742140e421be675ead1f6260a.png

是一个封装好的特定的集合(方法和函数)。是一个库,封装了很多预先定义好的函数在里面。

概念

  • jQuery是一个快速,简洁的js库。

  • j是js,query是查询,把js中的DOM操作作了封装,我们可以快速的查询使用里面的功能。

  • jQuery封装了js常用的功能代码,优化了DOM操作,事件处理,动画设计和ajax交互。

  • 学习jQuery的本质就是学习调用这些函数。

  • 使用jQuery可以提高开发者的开发效率。

优点

  • 轻量级,不影响页面的加载速度

  • 基本兼容了现在主流的浏览器

  • 连式编程,隐式迭代

  • 对事件样式、动画支持,大大简化了DOM操作

  • 支持插件扩展开发

  • 免费,开源

下载

https://jquery.com  官网地址https://code.jquery.com  各个版本的下载

使用jQuery时,等着DOM结构渲染完毕即可执行内部代码,不必等到所有外部资源加载完毕,jQuery帮我们完成了封装。相当于原生js中的DOMContentLoaded,不同于原生js中的load事件是等页面文档、内部的js文件、CSS文件,图片加载完毕才执行内部代码。

$是jQuery的别称,可以使用jQuery代替,$是jQuery的顶级对象,相当于原生js中的window,把元素利用$包装成jQuery对象,就可以调用。

jQuery对象与DOM对象

679d82e2996a7751f2afb38c37ef0eae.png

edbf110f29598ffb83a2a03c860ae8d4.png

  • 用原生js获取来的对象就是DOM对象

  • jQuery获取的元素就是jQuery对象

  • jQuery对象的本质是:利用$对DOM对象包装后产生的对象(维数组形式存储)

jQuery选择器

基础选择器$("选择器");层级选择器$("ul>li");  子代选择器(获取儿子)$("ul li");  后代选择器(获取ul下的所有li元素)筛选选择器:first  $("li:first");   获取第一个li元素$("li:last");    获取最后一个li元素        :eq(index) $("li:eq(2)");    获取索引号为2的li元素(从0开始)$("li:odd");      获取索引号为奇数的li元素$("li:even");     获取索引号为偶数的li元素

jQuery样式操作

常用的有两种

  1. css(),多用于样式少时操作,多了不方便

  2. 设置类样式方法

设置类样式方法比较和样式多时操作,可以弥补css()的不足,原生js中className会覆盖元素原先里面的类名,jQuery里面类操作只是对指定类进行操作,不影响原先的类名。

常见的jQuery动画效果

显示隐藏:show()/hide()/toggle();划入划出:slideDown()slideUp()/slideToggle();淡入淡出:fadeIn()/fadeOut()/fadeToggle()/fadeTo();自定义动画:animation();

注意:    动画或者效果一旦触发就会执行,如果多次触发,就造成多个动画或者效果排队执行,jQuery提供一个方法,可以停止动画排队

stop();

每次使用动画之前,先调用stop(),在调用动画。

jQuery属性操作

常用三种:prop()/attr()/data();语法操作1.获取属性操作prop("属性");2.设置属性语法prop("属性","属性值");元素自定义属性值attr()1.获取属性语法attr("属性");2.设置属性语法attr("属性","属性值");数据缓存data()可以在指定的元素上存取数据,并不会修改DOM元素结构,一旦页面刷新,之前存放的数据都将被移除。1.附加数据语法data("name","value");2.获取数据语法data("name");/常见文本属性,常见三种:html()/text()/val();分别对应js中的innerHTML,innerText和value属性,主要针对元素的内容还有表单的操作。1.普通元素内容html("内容")(识别标签)2.普通元素文本内容text("文本内容")(不识别标签)3.表单的值val("内容")

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/506374.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python数据库框架_目前最受欢迎的12个Python开源框架

1 Django Django是一款用Python语言写的免费开源的 Python Web应用开发框架,它遵循模型 -视图-控制器(MVC)的架构模式。它是由非营利Django维护软件基金会(DSF)和3条款BSD许可下可用,鼓励快速发展和实用的设计。Django同时是一款在数据库功能、后台功能、…

jenkins java常用插件下载,Jenkins简单介绍以及插件入门

Jenkins是一个广泛用于持续构建的可视化web工具,就是各种项目的的“自动化”编译、打包、分发部署,将以前编译、打包、上传、部署到Tomcat中的过程交由Jenkins,Jenkins通过给定的代码地址,将代码拉取到jenkins宿主机上&#xff0c…

linux安装python3.7的步骤_Linux 安装python3.7.3

我这里使用的是Redhat6.5,centos系统本身默认安装有python2.x,版本x根据不同版本系统有所不同,可通过 python --V 或 python --version 查看系统自带的python版本 有一些系统命令时需要用到python2,不能卸载 1、安装依赖包 1&…

python画三维立体图难吗_万万没想到,Python竟能绘制出如此酷炫的三维图

作者 | Jay Alammar转载自 | 高级农民工 通常我们用 Python 绘制的都是二维平面图,但有时也需要绘制三维场景图,比如像下面这样的:这些图怎么做出来呢?今天就来分享下如何一步步绘制出三维矢量(SVG)图。 八…

php人物行走,非常震撼的纯CSS3人物行走动画

今天分享给大家的是一个用纯CSS3实现的人物行走动画,在没有使用JavaScript的情况下,用CSS3技术将人物行走的姿态描绘得非常逼真。其实动画实现的原理也是比较简单的,将人物行走时的状态分割成多张图片,然后利用CSS3的动画属性将这…

php jquery 弹窗提示框,jQuery实现消息弹出框效果

本文实例为大家分享了jQuery消息弹出框的具体代码,供大家参考,具体内容如下效果图实现代码.showMessage {padding: 5px 10px;border-radius: 5px;position: fixed;top: 45%;left: 45%;color: #ffffff;}.showMessageSuccess {background-color: #00B7EE;}…

python定义字符串数组_python数组声明

广告关闭 腾讯云11.11云上盛惠 ,精选热门产品助力上云,云服务器首年88元起,买的越多返的越多,最高返5000元! 如何在python? 我无法在文档中找到对数组的任何引用... 我正在制作一个小程序,在静态数组上保存…

python函数定义中参数列表里的参数是_python函数定义中的参数说明

原博文 2020-05-23 07:50 − > 描述函数定义时 涉及到的 位置参数,默认参数,关键字参数,可变参数等的概念及用法 ## 1 示例代码#! /usr/bin/env python # -*- coding: UTF-8 -*- import logging def get_default_logger(): log... 相关推荐…

我的世界手机有PHP的开服器下载,【BDS】MC基岩版官方开服器Windows版插件开发包...

您尚未登录,立即登录享受更好的浏览体验!您需要 登录 才可以下载或查看,没有帐号?注册(register)xMC基岩版官方开服器Windows版插件开发教程2019年5月22日 作者:Player前言:MC基岩版官方开服器(BDS)自发布至…

c++ 协程_用yield实现协程

上一篇 理解python中的yield关键字 介绍了使用yeld实现生成器函数,这一篇我们来继续深入的了解一下yield,用yield实现协程。先来解答一下上一篇留下的问题:下面的代码为什么第二次调用next打印None呢?def 事实是这样的&#xff0c…

pandas 第一行_用Excel表格带你学习pandas最核心的处理操作,不再害怕条件统计

此系列文章收录在公众号中:数据大宇宙 > 数据处理 >E-pd转发本文并私信我"python",即可获得Python资料以及更多系列文章(持续更新的)经常听别人说 Python 在数据领域有多厉害,结果学了很长时间,连数据处理都麻烦得…

网页载入动画 php,网站页面加载动画代码

有时候网站服务器带宽不好或者用户网络不好,网站速度打开就会比较慢,那么用户等待就会比较无聊,下面准备了一个loading页面,可以在网站文件未完全加载完毕之前展示。HTML部分,放在body标签下面(最好是最靠近body)正在加…

ehcache缓存原理_贼厉害,手撸的 SpringBoot缓存系统,性能杠杠的!

缓存是最直接有效提升系统性能的手段之一。个人认为用好用对缓存是优秀程序员的必备基本素质。本文结合实际开发经验,从简单概念原理和代码入手,一步一步搭建一个简单的二级缓存系统。一、通用缓存接口1、缓存基础算法FIFO(First In First Ou…

angular 字符串转换成数字_Angular日期在TypeScript中格式化转换应用

组件模板中我们常常使用Angular内置管道DatePipe将其日期格式化,如同{{ startTime | date:yyyy-MM-dd }}这般操作,即可转换为字符串格式。那么在TS文件中我们也可以通过DatePipe或formatDate方法将其格式化。Angular日期在TypeScript中格式化转换应用​w…

python罗马数字转换,Python3.5实现的罗马数字转换成整数功能示例

本文实例讲述了Python3.5实现的罗马数字转换成整数功能。分享给大家供大家参考,具体如下:问题概述:给定一个罗马数字 ,将罗马数字转换成整数。如罗马数字I,II,III,IV,V分别代表数字 …

js在一个指定元素前添加内容_WebAR开发指南(1)---使用AR.js实现第一个WebAR demo...

前面有一篇文章万字干货介绍WebAR的实现与应用 分析了目前流行的WebAR框架并简单的介绍一些实现方法,这个专栏我们具体的来通过一些框架实现WebAR效果。关于AR.jsAR.js是一个轻量级的增强现实类JavaScript库,支持基于标记和位置的增强现实。开发人员可以…

python 最小二乘回归 高斯核_从简单数学建模开始:08最小二乘准则的应用(附python代码)...

模型拟合一般来说有这么三种:切比雪夫近似准则极小化绝对偏差之和最小二乘准则这几个原则各有各的适用范围。其中最小二乘准则是比较容易计算的。接下来我将简要的介绍最小二乘准则以及举例说明如何用python实现。最小二乘准则定义:给定某种函数类型 和 …

oracle 时间集合,oracle 日期函数集合(集中版本)第2/2页

oracle 日期函数集合(集中版本)第2/2页更新时间:2009年06月16日 23:45:55 作者:oracle 日期函数网上已经有了不少,特我们跟集中一下,免得大家麻烦。一、 常用日期数据格式1.Y或YY或YYY 年的最后一位,两位或三位SQL&g…

中缀表达式转后缀表达式两位数_再见,正则表达式!

从一段指定的字符串中,取得期望的数据,正常人都会想到正则表达式吧?写过正则表达式的人都知道,正则表达式入门不难,写起来也容易。但是正则表达式几乎没有可读性可言,维护起来,真的会让人抓狂&a…

php 腾讯云 文字识别_腾讯科技(成都)有限公司

成都IT内推圈是由IT行业老兵组建的民间组织,我们希望能为广大IT同仁提供力所能及的帮助,我们不仅提供靠谱的职位,我们更是有温度的圈子!为了帮助更多的朋友寻找到靠谱的内推职位,老农在此号召大家:1. 发布职…