jq选择器 | 易学教程

jQuery入门、jQuery选择器、jQuery操作

阅读更多关于 jQuery入门、jQuery选择器、jQuery操作

一、什么是jQuery及如何使用 1.1 jQuery 简介 jQuery是一个兼容多浏览器的javascript函数库(把我们常用的一些功能进行了封装，方便我们来调用，提高我们的开发效率。)，核心理念是write less,do more(写得更少,做得更多) 1.2 jQuery 和 Js 的区别 Javascript是一门编程语言，我们用它来编写客户端浏览器脚本。 jQuery是javascript的一个库（框架），包含多个可重用的函数，用来辅助我们简化javascript开发。注意：jQuery能做的javascipt都能做到，而javascript能做的事情，jQuer不一定能做到。二、jQuery 的基本使用 2.1 jQuery 的入口函数入口方式一 $(document).ready(function() { }); 入口方式二 $(function() { }); 2.2 $(document).ready和window.onload 区别 windows.onload方法是在网页中所有的元素（包括元素的所有关联文件）完全加载到浏览器后才执行，即Javascript此时才可以访问网页中的任何元素。 jQuery中的$（document）.ready（）方法注册的事件处理程序，在DOM完全就绪时就可以被调用。此时

17JQuery

阅读更多关于 17JQuery

1. 概念一个JavaScript框架。简化JS开发　　 jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。　　JavaScript框架：本质上就是一些js文件，封装了js的原生代码而已。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>自定义js框架</title> <script src="js/itcast.js"></script> </head> <body> <div id="div1">div1....</div> <div id="div2">div2....</div> <script> //1. 根据id获取元素对象 //var div1 = document.getElementById("div1"); //var div2 = document.getElementById("div2"); var div1 = $(

前端之Jquery

阅读更多关于前端之Jquery

前端之Jquery jQuery jQuery介绍 jQuery是一个轻量级的、兼容多浏览器的JavaScript库。 jQuery使用户能够更方便地处理HTML Document、Events、实现动画效果、方便地进行Ajax交互，能够极大地简化JavaScript编程。它的宗旨就是：“Write less, do more.“ jQuery的优势一款轻量级的JS框架。jQuery核心js文件才几十kb，不会影响页面加载速度。丰富的DOM选择器,jQuery的选择器用起来很方便，比如要找到某个DOM对象的相邻元素，JS可能要写好几行代码，而jQuery一行代码就搞定了，再比如要将一个表格的隔行变色，jQuery也是一行代码搞定。链式表达式。jQuery的链式操作可以把多个操作写在一行代码里，更加简洁。事件、样式、动画支持。jQuery还简化了js操作css的代码，并且代码的可读性也比js要强。 Ajax操作支持。jQuery简化了AJAX操作，后端只需返回一个JSON格式的字符串就能完成与前端的通信。跨浏览器兼容。jQuery基本兼容了现在主流的浏览器，不用再为浏览器的兼容问题而伤透脑筋。插件扩展开发。jQuery有着丰富的第三方的插件，例如：树形菜单、日期控件、图片切换插件、弹出窗口等等基本前端页面上的组件都有对应插件，并且用jQuery插件做出来的效果很炫

jQuery

阅读更多关于 jQuery

Jquery 高级版javascript 提供了更加便利的js使用方式楔子需求二：将上面的li标签实现隔行换色效果 js代码 <script> var obj = document.getElementsByClassName('city'); for (var j = 0;j < obj.length;j++){ if (j%2==0){ obj[j].style.backgroundColor = 'lightblue' }else{ obj[j].style.backgroundColor = 'lightgreen' } } </script> jquery代码 $('li:odd').css('background-color','lightblue') $('li:even').css('background-color','lightyellow') jquery介绍 js的痛点： window.onload事件只能出现一次如果出现多次，后面的事件会覆盖前面的事件浏览器兼容性问题简单的功能实现的很繁琐，例如：渐变的动画效果代码容错性差，如果此处报错，会影响后续代码执行 jquery的特点链式编程：比如 .show() 和 .html() 可以连写成 .show().html() 。隐式迭代：隐式对应的是显式。隐式迭代的意思是

jquery学习笔记1——选择器

阅读更多关于 jquery学习笔记1——选择器

一、jq选择器是什么： jq选择器是利用jq的核心函数，快速的选择DOM中的元素。jq选择器完全继承了CSS的风格。利用jq选择器，可以非常快捷和快速的找出特定的DOM元素，然后对他们添加相应的行为，而无需担心浏览器是否支持这一选择器。选择器是jq的根基，在jq中，对事件处理，遍历DOM和Ajax都要依靠jq选择器。二、jq选择器的特点： 1.简介的写法，相对了js原生使用jq选择器能大大的简化我们的代码。 2.支持css1到css3选择器，jq能支持css1，css2的全部和部分css3，同时他还有一些自己独有的选择器。 3.完善的处理机制，在使用jq选择器的使用不用做可行性测试，系统也不会报错。三、jq选择器的分类 1.基本选择器 2.层次选择器 3.过滤选择器 3.1 基本过滤选择器 3.2 内容过滤选择器 3.3 属性过滤出选择器 3.4 子元素过滤选择器 3.5 可见性过滤选择器 3.6 表单对象属性过滤选择器 4.表单选择器来源： CSDN 作者： Gideon丶M 链接： https://blog.csdn.net/mqqqq_1/article/details/51766410

js实现类选择器和name属性选择器

阅读更多关于 js实现类选择器和name属性选择器

jQuery的出现，大大的提升了我们操作dom的效率，使得我们的开发更上一层楼，如jQuery的选择器就是一个很强大的功能，它包含了类选择器、id选择器、属性选择器、元素选择器、层级选择器、内容筛选选择器等等，很是方便快捷，并且这些选择器的兼容性都很好，可以说操作dom使用jq选择器一时爽，一直使用一直爽！只是，目前Vue、React、Angular三大框架的出现大大降低了JQuery的使用频率，而且JQuery在操作dom和绑定数据时确实存在一定的性能问题和各种坑，但依旧不可抹杀jq在操作dom方面的强大存在！说了JQuery这么多的牛逼之处，那么它的很多内部原理是如何实现的呢？今天就来简单实现一个类似jQuery的类选择器和name属性选择器。类选择器： function getElementsByClass(className) { var classArr = []; var tags = document.getElementsByTagName("*"); for (var i = 0; i < tags.length; i++) { if (tags[i].nodeType == 1) { if (tags[i].getAttribute("class") == className) { classArr.push(tags[i]); } } } return

jquery选择器

阅读更多关于 jquery选择器

jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom条件等方法，jquery对象（集合对象）。Jquery使用$符号作为JQUERY的简化方式，某些其他JAVASCRIPT库中的函数（Portotype）同样使用$符号。 Varjq=jQuery.noconfilct();//用jq代替$ Jq(document).ready(function(){ });//防止文档在完全加载之前运行jquery代码而报错 1、$("*") 表示获取HTML标签以内所有的对象 2、$("#element") 等同于document.getElementById("element"); 3、$(".abc") 表示获得HTML中所有使用了abc这个样式的元素 4、$("div") 表示获得HTML中所有的div元素 5、$("#a,.b,p") 表示获得ID是a的元素和使用了类样式b的元素以及所有的p元素 <pid="a"class="b">sss</p> 6、$("#a.bp") 表示获得了ID是a的元素所包含的使用了类样式的b元素中的所有的p元素 <divid="a1"><divclass="b1"><p>sfdf</p></div></div> 7、$("Element1Element2Element3Element...") 与css定义层级元素方式一样

jQuery介绍

阅读更多关于 jQuery介绍

jQuery简介　　jQuery是JS的工具库，对原生JS中的DOM操作、事件处理、包括数据处理和Ajax技术等进行封装,提供更完善,更便捷的方法。　　中文网址：jquery123.com 1）引入先引入jquery文件，才能使用jquery语法 <script src="jquery-1.11.3.js"></script> 2）工厂函数 - $() "$()"函数用于获取元素节点，创建元素节点或将原生JS对象转换为jquery对象,返回 jQuery 对象。jQuery 对象实际是一个类数组对象，包含了一系列 jQuery 操作的方法。  <script src="jquery-1.11.3.js"></script> <body> <h1 id="d1" class="c1"></h1> <p></p> </body> //$()获取元素节点,需传入字符串的选择器 $("h1") $("#d1") $(".c1") $("body,h1,p") 3）原生JS对象与jQuery对象原生JS对象与jQuery对象的属性和方法不能混用。可以根据需要，互相转换 : 1  2 <script src="jquery-1.11.3.js"></script> 3 <script> 4 window.onload

jQuery

阅读更多关于 jQuery

jQuery 什么是jquery jQuery是一个JavaScript函数库。 jQuery是一个轻量级的"写的少，做的多"的JavaScript库。基础语法： $(*selector*).*action*() jQuery对象与js对象互相转换 var p1 = $("#p1"); // 得到jq对象 var p2 = document.getElementById("p1"); // 得到js对象 var jsp = p1[0]; // 将jq对象转成js对象 var jqp = $(p2); // 将js对象转成jq对象 jQuery 选择器选择器描述 $("id") id选择器 $("class") 类选择器 $("tagName") 标签选择器 $("div.d1") 配合选择器（类为d1的div标签） $("*") 所有元素选择器 $("#id, .className, tagName") 组合选择器 $("x y") 后代选择器 $("x > y") 子类选择器 $("x + y") 毗邻选择器 $("x ~ y") 兄弟选择器筛选器筛选器描述 :first 第一个 :last 最后一个 :eq(index) 索引等于index的标签 :even 匹配索引为偶数的标签，包括0 :odd 匹配索引为奇数的标签 :gt(index)

前端之jQuery

阅读更多关于前端之jQuery

目录 jQuery jQuery介绍 jQuery的优势 jQuery内容： jQuery版本 jQuery对象 jQuery基础语法查找标签基本选择器层级选择器：基本筛选器：属性选择器：表单筛选器：筛选器方法操作标签样式操作位置操作尺寸：文本操作属性操作文档处理事件常用事件事件绑定移除事件阻止后续事件执行阻止事件冒泡页面载入与window.onload的区别事件委托动画效果补充 each .data() 插件(了解即可) jQuery jQuery介绍 jQuery是一个轻量级的、兼容多浏览器的JavaScript库。 jQuery使用户能够更方便地处理HTML Document、Events、实现动画效果、方便地进行Ajax交互，能够极大地简化JavaScript编程。它的宗旨就是：“Write less, do more.“ jQuery的优势一款轻量级的JS框架。jQuery核心js文件才几十kb，不会影响页面加载速度。丰富的DOM选择器,jQuery的选择器用起来很方便，比如要找到某个DOM对象的相邻元素，JS可能要写好几行代码，而jQuery一行代码就搞定了，再比如要将一个表格的隔行变色，jQuery也是一行代码搞定。链式表达式。jQuery的链式操作可以把多个操作写在一行代码里，更加简洁。事件、样式、动画支持

订阅 jq选择器