首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

前端学习笔记—JavaScript和jQuery

函数在 JavaScript 中是第一类公民(first-class citizen),它们可以被赋值给变量、作为参数传递给其他函数,甚至可以在他函数中作为返回返回。...核心函数:$/jQuery 2.使用jQuery核心对象:执行$()返回的对象 DOM 对象加载完毕后,马上执行的函数。...选择器 选择器:就是定位条件;通知jquery函数定位满足条件的DOM对象 jQuery 基本选择器 ("#pop") 选取id名为pop的元素。...层次选择器通过 DOM 元素间的层次关系获取元素,其主要的层次关系包含后代、父子、相邻、兄弟关系,通过其中某类关系可方便快捷地定位元素。...属性选择器 jQuery 使用 XPath 表达式来选择带有给定属性的元素。 ("[href]") 选取所有带有 href 属性的元素。("[href!

11310
您找到你想要的搜索结果了吗?
是的
没有找到

JQuery中美元符号$

使用window.onload()的原因是因为一般都会希望直到网页加载完毕后,再立刻执行JS脚本的操作,否则会造成在执行JS脚本的时候, HTML文档没有渲染完成,DOM树是不完整,获取DOM中元素未定义的错误... 当然,window.onload与jQuery ready()两种加载方式还是有区别的: ? 2.2. 选择器 可以认为JQuery的美元符号 ?...就是一种选择器,基于已经存在的 CSS 选择器(当然不局限于),能够选取网页中的各种元素。CSS有三种常用的选择器:元素选择器、ID选择器和类选择器JQuery也有对应的选择器。 2.2.1.....inArray() 返回一个值在数组中的索引位置。 ? .type() 判断对象的类别 ? .getJSON() 使用 AJAX 请求来获得 JSON 数据。 ...... 3....参考 JavaScript window.onload jQuery 教程 jQuery选择器大全整理

80430

bootstrapValidator 中文API

返回表示该字段的jQuery元素的数组,或者null如果找不到这些字段。...参数 类型 描述 field 字符串| jQuery的 字段名称或字段元素如果未定义字段,则该方法将返回所有字段的所有错误消息 validator 串 验证器的名称如果未定义验证器,则该方法返回所有验证器的错误消息...参数 类型 描述 field 字符串| jQuery的 字段名称或字段元素如果未定义字段,则该方法返回表单选项。 validator 串 验证器的名称如果未定义验证器,则该方法返回所有字段选项。...option 串 选项名称如果未定义,则该方法返回给定验证器的选项 getSubmitButton getSubmitButton(): jQuery - 返回显示点击的提交按钮的jQuery元素。...参数 类型 描述 container 字符串| jQuery的 容器选择器或容器元件 isValidField isValidField(field*): Boolean - 检查该字段是否有效。

13.1K50

jQuery选择器Sizzle原理分析(下)

曾经红级一时的jQuery还记得吗?拥有号称当时业界最快的DOM选择器Sizzle,那么为什么他能自称是最快呢?让我们来分析一下Sizzle.js的源码,了解他的设计精妙之处。...关系选择器:如果token是关系选择器,则生成函数的时候需要同上一个选择器共同生成。 2. 非关系选择器:如果是非关系选择器,则直接判断种子是否满足条件即可。...为此我们可以得出几个优化选择器的结论: 1. 尽量在选择器以ID来查询,或者至少开头是以ID来查询:这样可以快速缩小查询的根节点。 2....在选择器最后尽量指定seed元素(千万不能用*):因为Sizzle会从最后的选择符开始寻找符合条件的seed集合 4. 尽量使用父子查询来代替后代查询:后代查询需要循环查找,父子查询范围小很多。...缓存已查询的jQuery对象:通过空间换时间的方式,不要每次都要执行过滤函数。 扫码下方二维码, 随时关注更多前端干货文章! ▼ 微信:IMWebTech

74820

JavaScript 学习-43.jQuery 选择器

前言 jQuery 选择器基于元素的 id、类、类型、属性、属性值等”查找”(或选择)HTML 元素。它基于已经存在的 CSS 选择器,除此之外,它还有一些自定义的选择器。...jQuery 选择器 jQuery 中所有选择器都以美元符号开头:$() 常用的一些选择器总结 语法 描述 $(this) 选取当前 HTML 元素 $("*") 选取所有元素 $("p") 匹配  <...,,通过定位当前元素,找到同一层级的该元素后面的全部兄弟元素 $('p, div') p标签和div标签元素 基础选择器 jQuery 查找元素语法,主要是基于css 选择器 根据标签匹配,不用加符号...console.log(b); var p3 = $('p.text-info'); // 查找class="text-info"的p标签 console.log(p3); 父子层级选择器...通过父子层级关系查找元素 1.子代选择器, 如#demo>p 2.后代选择器, 如#demo p 3.兄弟相邻选择器, 如#p1+div 4.同辈选择器, 如#p1~div 子代选择器,通过父元素找子元素用大于号

64020

JQueryJQuery入门——知识点讲解(二)

专栏介绍 【JQuery】 目前主要更新JQuery,一起学习一起进步。 本期介绍 本期主要介绍JQuery入门——知识点讲解(二) 文章目录 1. 层级选择器 2. ...属性选择器(通配符选择器) 3. 基本过滤选择器 4. 表单属性选择器 5. jQuery 操作 class 属性 6. 属性操作:prop()和 attr() 1. ...(父子) A+B 获得 A 元素同级下一个 B 元素(兄弟) A~B 获得 A 元素之后的所有 B 元素(兄弟) 代码准备: 2. ...属性选择器(通配符选择器) 我们可以通过属性选择器,以属性名或者值来匹配对应标签 [ 属性名 ] 获得有 指定属性名 的标签对象。...选择器 1][ 选择器 2][ 选择器 3] ,多个属性同时过滤。

41310

尚能饭否|技术越来越新,我对老朋友jQuery还是一如既往热爱

jar包\jQuery 4、jQuery选择器 「分类:」 基本选择器、层次选择器、过滤选择器(表单选择器) 「基本选择器:」 基本选择器jQuery中使用最频繁的选择器,它由元素...ID、Class、元素名、多个选择符组成,通过基本选择器可以实现大多数页面元素的查找 案例:通过不同的选择器来控制页面元素的展示 ?...「层次选择器:」 层次选择器通过DOM元素间的层次关系获取元素,其主要的层次关系包括后代、父子、相邻、兄弟关系,通过其中某类关系可以方便快捷地定位元素 选择器 功能描述 ancestor descendant...「过滤选择器:」 过滤选择器根据某类过滤规则进行元素的匹配,书写时都以冒号(:)开头 简单过滤器是使用最广泛的一种,ps:隔行变色 ?...属性过滤选择器,根据元素的某个属性获取元素,如ID号或匹配属性值的内容,并以“[”号开始,以“]”结束,ps:最后一个是复合属性选择器 ? 子元素过滤选择器,注意:nth-child索引从1开始 ?

79850

什么是jQuery

Jquey就是一款跨主流浏览器的JavaScript库,简化JavaScript对HTML操作 就是封装了JavaScript,能够简化我们写代码的一个JavaScript库 为什么要使用Jquery?...语法:$(js对象)---->jQuery对象 一般地,我们习惯在Jquery对象的变量前面写上$,表示这是JQuery对象 选择器 Jquery提供了九个选择器给我们用来定位HTML控件.....目的:通过九类选择器,能定位web页面(HTML/JSP/XML)中的任何标签 (1)基本选择器 直接定位id、类修修饰器、标签 (2)层次选择器父子,兄弟关系的标签 (3)增强基本选择器 大于、小于...Jquery关于DOM的API 前面使用Jquery选择器来获取到了HTML标签,单纯得到标签是没有用的。...我们来使用这个方法来获取当前的时间,对这个方法熟悉一下: 调用load方法的jquery对象,返回结果自动添加到jQuery对象代表的标签中间 如果带参数就自动使用post,不带参数自动使用get。

3K70

jQuery入门前言

对象 var $first = $div.first(); //找到第一个div元素 二、jQuery选择器: 1、id选择器 $( "#id" ): 所谓id选择器,就是相当于JavaScript的...5、层级选择器: 一个页面就是由各种标签构成的,各个标签之间存在着不同的关系,父子关系、兄弟关系等,层级选择器就可以处理这种关系。...image.png 7、内容筛选选择器: 基本筛选选择器针对的都是元素DOM节点,如果我们要通过内容来过滤,jQuery也提供了一组内容筛选选择器。其描述如下: ?...jquery对象,parents返回的是包含零个或一个或多个元素的jquery对象 4、next()、prev()和siblings()方法: 用于快速查找指定元素集合中每一个元素紧邻的后面同辈元素的元素集合...总结: 以上便是《jQuery入门》的全部内容,包含了jQuery选择器、属性与样式和对DOM的操作等相关内容。接下来在《jQuery进阶》中讲学习jQuery事件和Ajax,敬请关注!

2.7K30

jQuery性能优化

优先使用ID与标记选择器jQuery中,最快访问DOM元素的方式是通过元素ID号,其次是通过元素的标记。...正确使用选择器 jQuery内部将自动调用浏览器的原生方法,执行速度依据各浏览器支持情况 ID和元素标签选择器(各浏览器都支持)>元素类型选择器(各浏览器对应原生方法各不相同)>伪类型和属性选择器...(没有对应的原生方法) $("#id") > $(".class") > $(":input")/$("div[title='A']") 建议尽量减少使用伪类型及属性选择器去定位页面元素,少量在遍历时使用选择器...避免过度使用jQuery对象 在jQuery中,用户每次使用选择器获取页面中的元素时,都会自动生成一个jQuery对象,该对象包括众多的属性和方法,而通过对象自身去调用这些方法时,资源消耗相对要大很多...正确处理元素间父子关系 var $p = $("#parents"); var $c = $(".child"); $p.find($c); //执行速度最快 $p.children($c); $($

84231

前端无法让我冷静

组件生命周期 React生命周期分为了 挂载(装配) 、 更新 、 卸载 以及 捕错 四个状态阶段 react怎样提高性能 react的组件渲染分为初始化渲染和更新渲染 vue页面之间的通信 第一种,父子组件通信...1、类型选择器 2、简单属性选择器 3、组合选择器类型 归纳为!...pop()用于移除数组末尾的最后一项,然后返回移除的项 unshift:将参数添加到原数组开头,并返回数组的长度 shift():删除原数组第一项,并返回删除元素的值 HTTP协议的理解、TCP/IP三次握手...('box'); var $box = $(box); jQuery对象转原生DOM对象: var $box = $('#box'); var box = $box[0]; jQuery如何扩展自定义方法...值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol。

2.5K40

jQuery选择器大全(48个代码片段+21幅图演示)

选择器jQuery最基础的东西,本文中列举的选择器基本上囊括了所有的jQuery选择器,也许各位通过这篇文章能够加深对jQuery选择器的理解,它们本身用法就非常简单,我更希望的是它能够提升个人编写jQuery...本文配合截图、代码和简单的概括对所有jQuery选择器进行了介绍,也列举出了一些需要注意和区分的地方。 一、基本选择器 1. id选择器(指定id元素) 将id="one"的元素背景色设置为黑色。...class="wrap">G2 但是,请注意下面的代码: G1 G2 当G1所在div和G2所在div是父子关系时...需要大家注意的是,:fisrst和:last返回的都是单个元素,而:first-child和:last-child返回的都是集合元素。...举个例子:div:first返回的是整个DOM文档中第一个div元素,而div:first-child是返回所有div元素下的第一个元素合并后的集合。

5K80

Juqery就是这么简单

Jquey就是一款跨主流浏览器的JavaScript库,简化JavaScript对HTML操作 就是封装了JavaScript,能够简化我们写代码的一个JavaScript库 为什么要使用Jquery?...语法:$(js对象)---->jQuery对象 一般地,我们习惯在Jquery对象的变量前面写上$,表示这是JQuery对象\ 选择器 Jquery提供了九个选择器给我们用来定位HTML控件.....内容中是否有标签器、含有子元素或者文本的标签 大于、小于、等于、奇偶数的标签 有父子,兄弟关系的标签 直接定位id、类修修饰器、标签 (1)基本选择器 (2)层次选择器 (3)增强基本选择器 (4)内容选择器...(5)可见性选择器 (6)属性选择器 (7)子元素选择器 (8)表单选择器 (9)表单对象属性选择器 通过这九种的选择器,我们基本可以能获取HTML中任何位置的标签。...这里写图片描述 ---- Jquery关于DOM的API 前面使用Jquery选择器来获取到了HTML标签,单纯得到标签是没有用的。

2.3K50

jQuery选择器大全

选择器jQuery最基础的东西,本文中列举的选择器基本上囊括了所有的jQuery选择器,也许各位通过这篇文章能够加深对jQuery选择器的理解,它们本身用法就非常简单,我更希望的是它能够提升个人编写...---- 本文已经同步至我的个人博客站点:积累吧|jQuery选择器大全(48个代码片段+21幅图演示) 一、基本选择器 1. id选择器(指定id元素) 将id="one"的元素背景色设置为黑色...div class="wrap">G2 但是,请注意下面的代码: G1 G2 当G1所在div和G2所在div是父子关系时...需要大家注意的是,:fisrst和:last返回的都是单个元素,而:first-child和:last-child返回的都是集合元素。...举个例子:div:first返回的是整个DOM文档中第一个div元素,而div:first-child是返回所有div元素下的第一个元素合并后的集合。

5.1K10

01-老马jQuery教程-jQuery入口函数及选择器

1.2 为什么要学习jQuery 虽然前端的MVVM开发模式已经进入各个公司和各个开发人员的视野,而且也异常火爆。为什么还要学习jQuery呢?...这里简单说一点: jQuery包装对象本身是一个伪数组,选择器返回的所有的DOM元素都会存在jQuery的包装对象中,并且还有很多其他的jQuery特有的api。...// 第二种用法:还可以接受一个css的选择器(string),返回选择器对应dom节点的jQuery包装对象。 // 我们一般给jQuery的对象加一个$....console.dir($btn); // jQuery包装对象(所有的选择器选择返回的对象都是jQuery的包装对象。...($('.list li:first')); // 包含选择器 var $div = $('div:contains("laoma")'); // 如果选择器返回的是多个元素的时候

2.5K100

前端

image.png react怎样提高性能 react的组件渲染分为初始化渲染和更新渲染 vue页面之间的通信 第一种,父子组件通信 一.父组件向子组件传值 ? image.png ?...1、类型选择器 2、简单属性选择器 3、组合选择器类型 归纳为!...pop()用于移除数组末尾的最后一项,然后返回移除的项 unshift:将参数添加到原数组开头,并返回数组的长度 shift():删除原数组第一项,并返回删除元素的值 HTTP协议的理解、TCP/IP...('box'); var $box = $(box); jQuery对象转原生DOM对象: var $box = $('#box'); var box = $box[0]; jQuery如何扩展自定义方法...image.png 值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol。

1.9K41

JavaScript学习笔记(四)—— jQuery入门

1. jQuery选择器 - 选择器都是以 $() 开头的 基础选择器 选择器 描述 id选择器 指定id元素 class选择器 遍历css类元素 element元素 遍历HTML元素 *选择器 遍历所有元素...并列选择器 这类选择器将每一个选择器匹配到的元素合并后一起返回 id="notMe" id="...DOM元素之间的父子关系作为匹配筛选条件的选择器 选择器 描述 ancestor descendant 在给定的祖先元素下匹配所有的后代元素 parent>child 在给定的父元素下匹配所有的子元素...");//设置HTML内容 }); }); 对元素的值进行操作 在jQuery中,使用val()方法返回或设置被选元素的value属性。...keydown 在键盘上按下某键时触发,一直按一直触发 返回键盘代码 keypress 在键盘上按下一个能产生字符的按键时触发 返回ASCII码 keyup 松开某一键时触发 返回键盘代码 jQuery

11.2K50
领券