Jquery基本用法总结
选择器 $("#mydiv") 通过ID $("p#myp") 选择id=myp 的所有p元素(组合型) $(".mydiv") 通过 class="mydiv" $("p.myp") 选择class=myp 的所有p元素
$("p").eq(1) 获取匹配的集合中的第二个元素 这个元素的位置是从0算起(与[i]的区别是eq获得的还是jquery元素,而[i]获得的是dom元素) $("div:first") 选择第一个div $("div:odd") 选择奇数行div $('div:visible') //选择可见的div元素 $('div:gt(2)') //选择所有的div元素,除了前三个(:号的意义??)
$("div").has("p");选择包含p元素的div元素 ??? $("div").first() 选择第一个div ??? $("div").find("p") 选择div内的所有p元素
$("div").children() 取得所有div中的所有直接子元素,不考虑子元素的子元素 $("div").parents() 而parents将查找出所有祖辈元素 $("div").next() 取得紧邻的同辈元素,而不是后面所有的同辈元素(所有的用nextAll()) $("div").prev() 取得每个元素紧邻的前一个同辈元素的元素集合 $("form > input") 匹配表单中所有的一级子级input元素 $("form ~ input") 找到所有与表单同辈的 input 元素
属性选择器 采用XPath表达示来选择给定属性的元素 $("[href]") 选取所有带href属性的元素 $("[href='xxx']") 选取所有属性href='xxx' 的元素 $("[href*='.jpg']") 选取所有属性以.jpg结尾的元素
设置属性 $("div").attr("v","xxx"); $("div").removeAttr("v") 属性删除
复合选择器 $("input[id][name$='ma']") 选择所有含有id属性,且name属性以ma结尾的input元素 $("input:checked") 选择所有选中的筛选框元素 $("select option:selected") 选中所有选中的选项元素
改变HTML内容 $("div").html("xxxx") 相当于innerHTML $("div").append("<p>xxx</p>") 向div(内部)html追加p标签
元素的操作:移动 如果要移动选中的元素,有两种方法:一种是直接移动该元素,另一种是移动其他元素,使得目标元素达到我们想要的位置。 假定我们选中了一个div元素,需要把它移动到p元素后面。 第一种方法是使用.insertAfter(),把div元素移动p元素后面: $('div').insertAfter('p'); 第二种方法是使用.after(),把p元素加到div元素前面: $('p').after('div'); 表面上看,这两种方法的效果是一样的,唯一的不同似乎只是操作视角的不同。但是实际上,它们有一个重大差别,那就是返回的元素不一样。第一种方法返回div元素,第二种方法返回p元素。你可以根据需要,选择到底使用哪一种方法。 使用这种模式的操作方法,一共有四对: .insertAfter()和.after():在现存元素的外部,从后面插入元素 .insertBefore()和.before():在现存元素的外部,从前面插入元素 .appendTo()和.append():在现存元素的内部,从后面插入元素 .prependTo()和.prepend():在现存元素的内部,从前面插入元素
删除元素使用.remove()和.detach()。两者的区别在于,前者不保留被删除元素的事件,后者保留,有利于重新插入文档时使用。 清空元素内容(但是不删除该元素)使用.empty()。
$("input").val(xxx); 获取/设定 文本框中的值 $("input").text() 取出或设置text内容 如果结果集包含多个元素,那么赋值的时候,将对其中所有的元素赋值;取值的时候,则是只取出第一个元素的值(.text()例外,它取出所有元素的text内容)。
CSS 选择器/更改 $("div").css("background-color","red") 把所有 p 元素的背景颜色更改为红色 $("div").width(xxx) /.height(sss)设置高度与宽度
- Python补充03 Python内置函数清单
- 不懂JQuery的孩子:自封装Ajax函数
- .Net魔法堂:史上最全的ActiveX开发教程——ActiveX与JS间交互篇
- 飓风“桑迪”路径图的制作
- 根据标准word模板生成word文档类库(开源)
- Oracle 监听器无法启动(TNS-12555,TNS-12560,TNS-00525)
- Python补充02 Python小技巧
- 四则运算核心算法(开源)
- 页面分部分加载呈现收集(不断更新中)
- 测试控制鼠标的技巧
- .Net魔法堂:史上最全的ActiveX开发教程——自动更新、卸载篇
- 极品“马仔”域名mazai.com完成交易
- 高级语言,高级在哪?
- 安装配置Tomcat
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- PHP goto语句用法实例
- laravel5.5安装jwt-auth 生成token令牌的示例
- Windows环境下安装PHP Pear的方法图文教程
- php菜单/评论数据递归分级算法的实现方法
- 关于laravel5.5的定时任务详解(demo)
- 用PHP做了一个领取优惠券活动的示例代码
- Laravel 自定命令以及生成文件的例子
- 深入了解Python 变量作用域
- Laravel5.5 数据库迁移:创建表与修改表示例
- python代码能做成软件吗
- php适配器模式简单应用示例
- Python 解析简单的XML数据
- Laravel 实现Eloquent模型分组查询并返回每个分组的数量 groupBy()
- Python分类测试代码实例汇总
- Swoole 5将移除自动添加Event::wait()特性详解