jQuery-强大的jQuery选择器 (详解)】的更多相关文章

本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. jQuery 的介绍 引入 jQuery 的原因 在用 js 写代码时,会遇到一些问题: window.onload 事件有事件覆盖的问题,因此只能写一个事件. 代码容错性差. 浏览器兼容性问题. 书写很繁琐,代码量多. 代码很乱,各个页面到处都是. 动画效果很难实现. 如下图所示: jQuery的出现,可以解决以上问题. 什么是 jQuery jQuery 是 js…
Jquery 选择器 详解   在线文档地址:http://tool.oschina.net/apidocs/apidoc?api=jquery 各种在线工具地址:http://www.ostools.net/ 一.基本选择器 1 $("#div1").html("hello world 1"); //根据id匹配元素(a) 2 $(".c1").html("hello world 2"); //根据Yclass匹配元素(b)…
jquery $.trim()去除字符串空格详解 语法 jQuery.trim()函数用于去除字符串两端的空白字符. 作用 该函数可以去除字符串开始和末尾两端的空白字符(直到遇到第一个非空白字符串为止).它会清除包括换行符.空格.制表符等常见的空白字符. 参数 如果参数str不是字符串类型,该函数将自动将其转为字符串(一般调用其toString()方法).如果参数str为null或undefined,则返回空字符串(""). 返回值 jQuery.trim()函数的返回值为String…
CSS选择器详解 之 伪类 伪类对大小写不敏感 结构伪类选择器 结构伪类是CSS3新增的类型选择器,利用DOM树实现元素过滤,通过文档结构的相互关系来匹配元素,可以减少class和id属性的定义,使文档变得更加简洁. :root 选择元素所在文档的根元素.在(X)HTML文档中,根元素始终是html元素. :not() 否定选择器,和jQuery中的:not选择器一模一样,可以选择除某个元素之外的所有元素. e.g. HTML: <body> <div id="header&q…
10-CSS3选择器详解 #CSS3介绍 CSS3在CSS2基础上,增强或新增了许多特性, 弥补了CSS2的众多不足之处,使得Web开发变得更为高效和便捷. #CSS3的现状 浏览器支持程度不够好,有些需要添加私有前缀 移动端支持优于PC端 不断改进中 应用相对广泛 #应对的策略:渐进增强 (1)坚持渐进增强的原则:让低版本浏览器能正常访问页面,高版本的浏览器用户体验更好.[重要] 比如说,同样是一个头像,可能在低版本的浏览器中,头像方的:在高版本的浏览器中,头像是圆的. (2)考虑用户群体.…
CSS3选择器详解 一. 属性选择器 在CSS3中,追加了三个属性选择器分别为:[att*=val].[att^=val]和[att$=val],使得属性选择器有了通配符的概念. 选择器 示例 描述 [attribute^=value] [src^="https"] 选择每一个src属性的值以"https"开头的元素 [attribute$=value] [src$=".pdf"] 选择每一个src属性的值以".pdf"结尾的…
一.CSS后代选择器详解 1,  生动介绍基本概念 一个标签嵌B在另一个标签A内部,B就是A的后代. 而且,B的后代也是A的后代,这就叫“子子孙孙无穷尽也”. 比如: <div> <p>这个p标签是div的后代</p> <div> 后代选择器就是用来选择一个标签的后代的: 两个选择器中间添加一个[空格]就构成了后代选择器,空格后面的那个是后代. 例如: div p { color : red; } 它会选择一堆的p标签,只要这个p标签是嵌套在某个div标签内…
9.选择器详解 9.1  属性选择器 CSS3 属性选择器,在 CSS3 中,追加了三个属性选择器分别为:[att*=val].[att^=val]和[att$=val],使得属性选择器有了通配符的概念. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style>…
4.  元素选择器详解 4.1  元素选择器 4.2  选择器分组 用英文逗号","相连,使用相同的样式表 使用通配符对所有元素进行通用设定. 4.3  类选择器详解 4.3.1.  类选择器允许以一种独立于文档元素的方式来指定样式 .class{} 4.3.2.  结合元素选择器 a.class{} (只指定a标签内的class类) <!DOCTYPE html> <html lang="en"> <head> <meta…
1.基本选择器 l ID 根据元素ID选择 l Elementname 根据元素名称选择 l Classname 根据元素css类名选择 举例: <input type=”text” id=”ID” value=”根据ID选择”/> <a>根据元素名称选择</a> <input type=”text” class=”classname” value=”根据元素css类名选择”/> 取值: jQuery(“#ID”).val(); jQuery(“a”).te…