jquery name选择器

一 jQuery是什么？ <1> jQuery由美国人John Resig创建，至今已吸引了来自世界各地的众多 javascript高手加入其team。 <2>jQuery是继prototype之后又一个优秀的Javascript框架。其宗旨是——WRITE LESS,DO MORE! <3>它是轻量级的js库(压缩后只有21k) ，这是其它的js库所不及的，它兼容CSS3，还兼容各种浏览器 <4>jQuery是一个快速的，简洁的javaScript库，使用户能更方便地处理HTMLdocuments、events、实现动画效果，并且方便地为网站提供AJAX交互。 <5>jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。 二 什么是 jQuery 对象？ jQuery 对象就是通过 jQuery 包装 DOM 对象后产生的对象。 jQuery 对象是 jQuery 独有的 . 如果一个对象是 jQuery 对象 , 那么它就可以使用 jQuery 里的方法 : $(“#test”).html(); $("#test").html() //意思是指：获取ID为test的元素内的html代码。其中html()是jQuery里的方法 // 这段代码等同于用DOM实现代码： document.getElementById("

目录 JQuery JQuery介绍 JQuery优势 JQuery内容 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 （一）jQuery介绍 （二）版本介绍 （三）jQuery对象 （四）相关网站 （五）基础语法 二、查找标签 （一）基本选择器 （1）id选择器 （2）标签选择器 （3）class选择器 （4）条件选择器 （5）所有元素选择器 （6）分组选择器 （二）层级选择器 （1）后代选择器 （2）儿子选择器 （3）相邻选择器 （4）兄弟选择器 （三）属性选择器[] （四）基本筛选器: （五）表单筛选器 （1）input标签type参数值筛选 （2）表单对象属性 （3）BUG (六)、筛选器方法 （1）next （2）prev （3）parent （4）儿子和兄弟元素 （5）find （6）filter （7）补充 三、操作标签 （一）样式操作 （二）位置操作 （三）尺寸 （四）文本操作 （五）属性操作 （1）attr （2）prop （六）标签操作 （1）append （2）prepend （3）after （4）before （5）remove和empty （6）replace （7）clone 五、事件 （一）常用事件 （二）事件绑定 （1）on （2）off （三）阻止后续事件执行 （四）事件冒泡 （五）事件委托 （六）页面载入ready 一、初识jQuery （一）jQuery介绍 jQuery是一个轻量级、兼容多浏览器的JavaScript库

目录 JQuery介绍 JQuery优势 JQuery版本 JQuery对象 声明JQuery对象的语法 JQuery基本的语法 JQuery把文件导入模板中 查找标签 基本选择器 层级选择器 筛选器 基本筛选器 属性筛选器 表单筛选器 操作标签 样式操作 文本操作 文档处理 属性操作 克隆 位置操作 事件 事件的绑定 input监听默认的事件 阻止事件冒泡 JQuery介绍 JQuery是一个轻量级、兼容多浏览器的js库，相当于python中的模块。 JQuery使用户能够更方便的处理HTML Document、Evnets（事件触发器）、实现动画效果、方便进行Ajax（创建快速动态页面的技术）、交互，能够极大的简化js编程。它的总是就是：写很少的代码，做更多的事情 JQuery优势 一款轻量级的js框架。JQuery核心js文件才几十kb，不会影响页面的加载速度。 丰富的DOM选择器，JQuery的选择器用来很方便，比如要找到某个DOM对象的相邻的元素，js也是一行代码就能搞定。 链式表达式。JQuery的链式操作可以把多个操作写在一行代码里，更加简洁。 事件、样式、动画支持。JQuery还简化了js操作css的代码，并且代码的可读性也比js要强。 Ajax（创建快速动态页面的技术）操作支持。JQuery简化了AJAX操作

目录 BOM与DOM window对象 navigator对象（了解即可） screen对象（了解即可） history对象（了解即可） location对象 弹出框 计时相关 DOM对象 DOM结构 查找标签 直接查找 间接查找 节点操作 创建节点 添加节点 删除节点： 替换节点： 属性节点 获取值操作 class的操作 指定CSS操作 事件 常用事件 绑定方式 jQuery 介绍 优势 版本 基础语法 使用 jQuery对象 查找标签 基本选择器 层级选择器： 基本筛选器： 属性选择器： 表单筛选器 ： BOM与DOM BOM（Browser Object Model）是指浏览器对象模型，它使 JavaScript 有能力与浏览器进行“对话”。 DOM （Document Object Model）是指文档对象模型，通过它，可以访问HTML文档的所有元素。 window对象 Window对象是客户端JavaScript最高层对象之一，由于window对象是其它大部分对象的共同祖先，在调用window对象的方法和属性时，可以省略window对象的引用。例如：window.document.write()可以简写成：document.write()。 window对象方法 方法 说明 open()、close() 打开窗口、关闭窗口 resizeBy()、resizeTo()

目录 form表单 form标签 input标签 button标签 select标签---下拉框选择 textarea标签---多行普通文本 CSS简介 CSS: 层叠样式表 基本选择器 元素选择器 id选择器 类选择器 通用选择器 组合选择器 属性选择器 分组与嵌套 伪类选择器 选择器优先级 form表单 能够获取用户输入的信息(文本信息, 选择信息, 上传的文件信息), 并将用户输入的信息全部发送给后端 form标签 参数: action, 控制数据提交的地址, 三种书写格式: 不写, 默认朝当前页面所在的地址提交数据 写全路径 ( https://www.baidu.com ) 只写路径后缀 (/index/), 前面地址固定, 会自动根据后缀识别并添加前面地址 method, 控制数据提交的方式 get, form表单默认是get请求 post enctype: encodetype, 编码类型 multipart/form-data是指表单数据有多部分构成，既有文本数据，又有文件等二进制数据 enctype的默认值不能用于文件上传 <form action="" method="post" enctype="multipart/form-data"> <!--...--> </form> input标签 通常情况下input需要结合label一起使用 <p> <label

一、什么是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完全就绪时就可以被调用。此时

1.测试并提升你的jQuery选择器水平 这个 jQuery选择器实验室 非常酷，它能在线免费使用，当然你也能下来到本地离线使用。这个测试页面包含复杂的HTML组合字段，然后你能尝试预定义使用各种jQuery选择器。如果这还不够你也可以自定义选择器。 点击上图查看清晰大图 2.测试jQuery包装集是否包含某些元素 　　如果你想测试一下某个jQuery包装集中是否包含某些元素，你首先可以尝试使用验证首个元素是否存在： if($(selector)[0]){...} // 或者这样 if($(selector).length){...} 来看看这个例子： //例子.如果你的页面有以下html代码 <ul id="shopping_cart_items"> <li><input class="in_stock" name="item" type="radio" value="Item-X" />Item X</li> <li><input class="unknown" name="item" type="radio" value="Item-Y" />Item Y</li> <li><input class="in_stock" name="item" type="radio" value="Item-Z" />Item Z</li> </ul> <pre escaped="true

前端之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 高级版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() 。 隐式迭代： 隐式 对应的是 显式。隐式迭代的意思是