jquery name选择器 | 易学教程

JQuery（选择器、事件、DOM操作）

阅读更多关于 JQuery（选择器、事件、DOM操作）

一、jQuery简介 jQuery 是一个 JavaScript 库。 jQuery 极大地简化了 JavaScript 编程。 jQuery 库位于一个 JavaScript 文件中，其中包含了所有的 jQuery 函数。 $：jQuery标识符二、jQuery选择器 1.基本选择器 ①ID选择器:# $("#div1").css("background-color", "red") ②class选择器：. 1 $(".div2").css("background-color", "red"); ③标签选择器 $("div").css("background-color", "red"); ④并列 $("#div1,#div2").css("background-color", "red"); //并列选择，用逗号隔开 ⑤后代 $("#div1 a").css("background-color", "red"); //后代选择，用空格隔开 2、过滤选择器（1）、基本过滤 ①首个：:first $(".div:first").css("background-color", "red"); //取首个 ②尾个：:last $(".div:last").css("background-color", "red"); //取最后一个 ③任意个：:eq(索引号) $(".div:eq

jQuery---jq基础了解(语法,特性),JQ和JS的区别对比,JQ和JS相互转换,Jquery的选择器(基础选择器,层级选择器,属性选择器),Jquery的筛选器(基本筛选器,表单筛选器),Jquery筛选方法

阅读更多关于 jQuery---jq基础了解(语法,特性),JQ和JS的区别对比,JQ和JS相互转换,Jquery的选择器(基础选择器,层级选择器,属性选择器),Jquery的筛选器(基本筛选器,表单筛选器),Jquery筛选方法

jQuery---jq基础了解(语法,特性),JQ和JS的区别对比,JQ和JS相互转换,Jquery的选择器(基础选择器,层级选择器,属性选择器),Jquery的筛选器(基本筛选器,表单筛选器),Jquery筛选方法一丶什么是JQuery JQuery: JQuery是js的一个库,高度封装了js常用的功能,提供简便方法,调用简单,提高开发效率 js库是包含了把复杂的功能封装到简单的方法中 JQuery的两大特性: 链式编程:可以.的形式实现多个功能隐式迭代:在方法的内部进行遍历循环,而不是我们自己再进行循环,简化操作,方便调用更好的兼容性:JQuery自动做了浏览器的兼容问题 JQuery的引入: 压缩(XXX.min.js)与未压缩 // 1. 压缩过的文件更小,不占据空间,利于网络传输,可读性不高 // 2. 未压缩的文件占据空间,不利于网络传输,可读性高引入 :导入文件一定要在自定义script标签之上   <script src="jquery3.4.1.min.js"></script> <script> // 自定义JQ/js代码 </script> //在控制台输入jQuery //结果如下,则表示引入JQ成功 ƒ (e,t){return

前端——jQuery

阅读更多关于前端——jQuery

　　jQuery是JS的工具库，对原生JS中的DOM操作、事件处理、包括数据处理和Ajax技术等进行封装，使用 . 链式写法，提供更完善,更便捷的方法。　　再使用jquery之前，我们需要先引入jquery文件，才能使用jquery语法，导入jQ文件的方法有两种。从 jquery.com 下载 jQuery 库，本地导入（比较常用）从 CDN（内容分发网络）中载入 jQuery，Staticfile CDN、百度、新浪、谷歌和微软的服务器都存有 jQuery 。 <head> // 本地导入 <script src="js/jquery.min.js"></script> // 从 Staticfile CDN 导入 <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"> // 百度CDN <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"> </head> 注意：使用CDN有一个很大的优势，那就是许多用户在访问其他站点时，已经从百度、又拍云、新浪、谷歌或微软加载过 jQuery。当他们访问您的站点时，会从缓存中加载 jQuery，这样可以减少加载时间。同时，大多数 CDN

JQ选择器

阅读更多关于 JQ选择器

1.#id 查找ID 为myDIV的元素 <body> <div class="mydiv"><p> I am little D!</p></div> <div class="opl"> <p>小弟</p> </div> <script src="../js/jquery-3.1.0.min.js"></script> <script type="text/javascript"> console.log($(".mydiv")); </script> </body> 2.element 用于搜索的元素指向DOM节点的标签名 <body> <div>div</div> <div>div2</div> <span>span</span> <script src="../js/jquery-3.1.0.min.js"></script> <script type="text/javascript"> console.log($("div")); </script> </body> 3. .class 获取类 <div class="notMe">div class="notMe"</div> <div class="myClass">div class="myClass"</div> <span class="myClass">span class="myClass"</span>

jq 选择器

阅读更多关于 jq 选择器

层次选择器： $('div p');//选取div下的所有的p元素 $('div>p').css('border','1px solid red');//只选取div下的直接子元素 //相邻的元素 $('div ~ p).css('border','1px solid red');与$('div').nextAll('p')等价;//表示div后面的所有p兄弟元素 $('div ~ *').css('border','1px solid red');//表示div后面的所有兄弟元素 $('div +p').css('border','1px solid red');与$('div').next('p')等价//这种写法表示div后只找紧挨着的第一个兄弟元素，并且该元素是p。获得兄弟元素的方法： next(); //当前元素之后的紧邻着的第一个兄弟元素（下一个） nextAll();//当前元素之后的所有兄弟元素 prev();//当前元素之前的紧邻着的兄弟元素（上一个） prevAll();//当前元素之前的所有兄弟元素 siblings();//当前元素的所有兄弟元素基本过滤选择器： $('p:first')与$('p').first()是等价的。获取所有p元素中的第一个P元素 $('p:last')与$('p').last() $('p:eq(2)'

jQ - 选择器

阅读更多关于 jQ - 选择器

1.jQuery-选择器 1)基本选择器　　 #id 　　根据给定的ID匹配一个元素 $("#myDiv");　　　　　 element 　　根据给定的元素名匹配所有元素 $("div"); 　　 .class 　　根据给定的类匹配元素 $(".myClass"); 　　 * 　　匹配所有元素 $("*") 　　　　 selector1,selector2,selectorN 　　将每一个选择器匹配到的元素合并后一起返回。 $("div,span,p.myClass") 2）层级选择器　　ancestor descendant 　　在给定的祖先元素下匹配所有的后代元素 $("form input") 　　 parent > child 　　匹配父级元素下的子级元素 $("form > input") 　　 prev + next 　　匹配所有紧接在 prev 元素后的 next 元素（相当于css中的相邻选择器） $("label + input") 　　prev ~ siblings 　　匹配 prev 元素的所有同辈 siblings 元素（相当于css中的兄弟选择器） $("form ~ input") 3)基本过滤选择器　　 :first 　　获取第一个元素 $('li:first'); //获取第一个li元素　　 :last　　　　获取最后个元素

jQuery温习篇---强大的JQuery选择器

阅读更多关于 jQuery温习篇---强大的JQuery选择器

学习 jQuery 已经有 1 年多的时间了，但是一直由于做 WinForm 程序开发没有经常实践。现在又开始重拾 WebForm 开发。写几篇 jQuery 系列，温习下 jQuery 框架的知识。在 jQuery 出世以来，它取得很大的成就和认同。 JQuery 是一个轻量级的 JavaScript 框架，它的发布版很小仅 16K 左右。它能让你方便简洁的写出漂亮的动画效果、实现各种视觉效果，轻松的处理 JavaScript 的 DOM 数以及 Ajax 的交互行为。它的优点在于轻量级、简单易学、易扩展、跨浏览器和网上拥有大量的 jQuery 插件使用。由于它这一大堆的优点，它已经被微软官方认可加入 VS IDE 中拥有强大的智能提示，并据官方的统计现在至少有 20% 的国际性大网站已经加入 jQuery 作为其脚本。 1 ：首先是 JavaScript 的 DOM 和 jQuery 包装集的区分 1.1: 在 JavaScript 中我们访问的方式是操作 DOM 结构 , 提供的可用方法有： 1: document.getElementById("ID") ：根据 ID 获取 DOM 对象。 2 ： document.getElementsByName("name") ：根据 HTML 标记 name 属性获取一个 DOM 数组。 3 ： document

Web_jQuery

阅读更多关于 Web_jQuery

第1章： jQuery简介为了简化 JavaScript 的开发，一些 JavsScript 库诞生了。 JavaScript库封装了很多预定义的对象和实用函数，简化HTML与JavaScript之间的操作，能帮助使用者建立有高难度交互的页面，并且兼容各大浏览器。当前流行的 JavaScript 库有 jQuery是继prototype之后又一个优秀的JavaScript框架。如今， jQuery已经成为最流行的JavaScript库。在世界前10000个访问最多的网站中，有超过55%在使用jQuery。 jQuery，顾名思义，也就是JavaScript和查询（query），其宗旨是“WRITELESS,DO MORE”，极大地简化了JavaScript开发人员遍历HTML文档，操作Dom，处理时间，执行动画和开发Ajax，具体来说，优势如下 jQuery是免费、开源的轻量级(压缩后只有几十k) 强大的选择器出色的 DOM 操作的封装可靠的事件处理机制完善的 Ajax使用出色的多浏览器兼容性隐式迭代：对集合对象做相同操作时不需要逐个进行遍历，jQuery自动进行遍历文档说明很全可扩展插件第2章：jQuery快速入门 jQuery库实际上就是一个js文件，只需要在网页中直接引入这个文件就可以了。将jQuery的库文件加入在开发测试时,

jQuery最佳实践

阅读更多关于 jQuery最佳实践

上周，我整理了《jQuery设计思想》。那篇文章是一篇入门教程，从设计思想的角度，讲解 "怎么使用jQuery" 。今天的文章则是更进一步，讲解 "如何用好jQuery" 。我主要参考了Addy Osmani的PPT 《提高jQuery性能的诀窍》（jQuery Proven Performance Tips And Tricks）。他是jQuery开发团队的成员，具有一定的权威性，提出的结论都有测试数据支持，非常有价值。 ============================================== jQuery最佳实践阮一峰整理 1. 使用最新版本的jQuery jQuery的版本更新很快，你应该总是使用最新的版本。因为新版本会改进性能，还有很多新功能。下面就来看看，不同版本的jQuery性能差异有多大。这里是三条最常见的jQuery选择语句：　　$('.elem') 　　$('.elem', context) 　　context.find('.elem') 我们用1.4.2、1.4.4、1.6.2三个版本的jQuery 测试，看看浏览器在1秒内能够执行多少次。结果如下：可以看到，1.6.2版本的运行次数，远远超过两个老版本。尤其是第一条语句，性能有数倍的提高。其他语句的测试，比如 .attr("value") 和 .val()

JQuery选择器

阅读更多关于 JQuery选择器

JQuery选择器 1.基本选择器和CSS的定义差不多：标签选择器 id选择器（#）类选择器（点）并集选择器（逗号） <head> <meta charset="UTF-8"> <title>选择器·基本选择器</title> <script src="js/jquery-3.3.1.min.js"></script> <script> $(function() { //id选择 $("#divOne").css("color", "red"); //标签选择 $("span").css("color", "green"); //class选择 $(".clsTwo").css("color", "blue"); //合并选取 $("#divOne,span,.clsTwo").css("fontSize", "50px"); }); </script> </head> <body> <div id="divOne">有ID的div</div> <span>span</span> <div class="clsTwo">有class的div</div> </body> <head> <meta charset="UTF-8"> <title>并集选择器：3 Click in 1</title> <script type="text/javascript" src="js

订阅 jquery name选择器