2009.11.18——jquery(3)
3.1 生成新的HTML
$()函数不仅能选择现有的页面元素,还能够生产新的HTML
$("<div>Hello</div>") //新建一个div元素
$("<div>") //新建一个空的div元素 但是这个简化的技巧不能创建<script>元素
$("<div class='foo'>I have foo!</div><div>I don't</div>").filter(".foo").click(function(){
alert("I'm foo!");
}).end().appendTo("#name");
这个,首先创建了两个<div>元素,一个带有css类foo,另一个没有,然后收窄选择范围,只选择带有类foo的<div>元素,并给它绑定事件处理程序,点击时,就会触发警告窗口。最后,使用end()函数,还原到包含两个<div>元素的完整集合,并把这两个元素追加到id为name的元素后面
3.2 包装集
jQuery元素包装集和数组非常类似
3.2.1 确定长度——size()
size()
参数:
无
返回:
元素的个数
$('#name').html('这里有'+$('a').size()+'个链接');
size()将会返回$('a')里面<a>元素的个数
和属性length是一样的
3.2.2 获取元素——get()
get(index)
参数
index 下标,用于指定将被返回的单个元素,如果省略,整个包装集以数组的形式返回
返回
一个DOM元素或DOM元素数组
$('img[alt]').get(0) <===> $('img[alt]')[0] //返回带有alt特性的所有<img>元素的集合的第一个元素
var arr = $('img[alt]').get(); //以数组形式返回带有alt特性的所有<img>元素的集合
3.2.3 添加元素
add(expression)
参数
expression 指定添加到包装集的元素,参数如果是jQuery选择器,则把匹配元素添加到集合;如果是html, 则创建适当的元素并添加到集合;如果是dom元素,则直接添加到集合中
返回:
包装集
$('img[alt]').add('img[title]') <====> $('img[alt],img[title]')
把多个选择器链用"或"的关系联系起来,取并集
3.2.4 整理内容
not,与非操作 取差集
not(expression)
参数
expression jQuery筛选器表达式、元素引用或元素引用的数组,定义从包装集里删除的元素
$('img[title]').not('[title*=puppy]') //包含带有title特性,并且title里面没有puppy文本的img元素
3.1 生成新的HTML
$()函数不仅能选择现有的页面元素,还能够生产新的HTML
$("<div>Hello</div>") //新建一个div元素
$("<div>") //新建一个空的div元素 但是这个简化的技巧不能创建<script>元素
$("<div class='foo'>I have foo!</div><div>I don't</div>").filter(".foo").click(function(){
alert("I'm foo!");
}).end().appendTo("#name");
这个,首先创建了两个<div>元素,一个带有css类foo,另一个没有,然后收窄选择范围,只选择带有类foo的<div>元素,并给它绑定事件处理程序,点击时,就会触发警告窗口。最后,使用end()函数,还原到包含两个<div>元素的完整集合,并把这两个元素追加到id为name的元素后面
3.2 包装集
jQuery元素包装集和数组非常类似
3.2.1 确定长度——size()
size()
参数:
无
返回:
元素的个数
$('#name').html('这里有'+$('a').size()+'个链接');
size()将会返回$('a')里面<a>元素的个数
和属性length是一样的
3.2.2 获取元素——get()
get(index)
参数
index 下标,用于指定将被返回的单个元素,如果省略,整个包装集以数组的形式返回
返回
一个DOM元素或DOM元素数组
$('img[alt]').get(0) <===> $('img[alt]')[0] //返回带有alt特性的所有<img>元素的集合的第一个元素
var arr = $('img[alt]').get(); //以数组形式返回带有alt特性的所有<img>元素的集合
3.2.3 添加元素
add(expression)
参数
expression 指定添加到包装集的元素,参数如果是jQuery选择器,则把匹配元素添加到集合;如果是html, 则创建适当的元素并添加到集合;如果是dom元素,则直接添加到集合中
返回:
包装集
$('img[alt]').add('img[title]') <====> $('img[alt],img[title]')
把多个选择器链用"或"的关系联系起来,取并集
3.2.4 整理内容
not,与非操作 取差集
not(expression)
参数
expression jQuery筛选器表达式、元素引用或元素引用的数组,定义从包装集里删除的元素
$('img[title]').not('[title*=puppy]') //包含带有title特性,并且title里面没有puppy文本的img元素