Jquery重新学习之四[核心属性与文档处理属性]
2013-12-01 23:00
561 查看
1:核心.each(callback),size(),length(),get([index])
1.1 .each(callback)通过它可以遍历对象、数组的属性值并进行处理
1.2 .size()当前匹配的元素个数
1.3 .length()同样是返回元素个数
1.4 .get([index])取得其中一个匹配的元素,没有参数时则取得所有匹配的 DOM 元素集合。有参数时取得第 index 个位置上的元素。$(this).get(0)与$(this)[0]等价
2:文档处理.append(content|fn)与appendTo(content),prepend(content|fn)与prependTo(content)
2.1 .append(content) 参数content向每个匹配的元素内部追加内容,而content则是要追加到目标中的内容[$(A).append(B): 将B追加到A中];
2.2 .append(fn) 参数function(index, html)返回一个HTML字符串,用于追加到每一个匹配元素的里边。接受两个参数,index参数为对象在这个集合中的索引值,html参数为这
个对象原先的html值。
2.3 .appendTo(content)把所有匹配的元素追加到另一个指定的元素元素集合中,参数content用于被追加的内容;[$(A).append(B): 将A追加到B中]
2.5 .prepend(content) 向每个匹配的元素内部前置内容,参数要插入到目标元素内部前端的内容
2.6 .prepend(fn) 参数function(index, html)返回一个HTML字符串,用于追加到每一个匹配元素的里边。接受两个参数,index参数为对象在这个集合中的索引值
2.7 .prependTo(content) 把所有匹配的元素前置到另一个、指定的元素元素集合中
1.1 .each(callback)通过它可以遍历对象、数组的属性值并进行处理
<form id="form1" runat="server"> <img/><img/> </form> <script type="text/javascript"> $(function () { $("img").each(function (i) { this.src = "test" + i + ".jpg"; }); }) </script>
$(document).ready(function () { var members = ["张三", "李四", "王老五", "赵老六", "王二麻子"]; var ol = $("ol"); $.each(members, function (index, item) { ol.append("<li>" + item + "</li>"); }) });
1.2 .size()当前匹配的元素个数
<img src="test1.jpg"/> <img src="test2.jpg"/> $("img").size();-->显示为:2
1.3 .length()同样是返回元素个数
<img src="test1.jpg"/> <img src="test2.jpg"/> $("img").length;-->显示为:2
1.4 .get([index])取得其中一个匹配的元素,没有参数时则取得所有匹配的 DOM 元素集合。有参数时取得第 index 个位置上的元素。$(this).get(0)与$(this)[0]等价
<img src="test1.jpg"/> <img src="test2.jpg"/> $("img").get(0);-->获得dom无素: <img src="test1.jpg"/>
2:文档处理.append(content|fn)与appendTo(content),prepend(content|fn)与prependTo(content)
2.1 .append(content) 参数content向每个匹配的元素内部追加内容,而content则是要追加到目标中的内容[$(A).append(B): 将B追加到A中];
<div id="My_Div"></div> <script type="text/javascript"> $(function () { $("#My_Div").append("<span style='color:red'>踏浪帅</span>") }) </script>
2.2 .append(fn) 参数function(index, html)返回一个HTML字符串,用于追加到每一个匹配元素的里边。接受两个参数,index参数为对象在这个集合中的索引值,html参数为这
个对象原先的html值。
<div></div> <div></div> <script type="text/javascript"> $(function () { $("div").append(function (index) { return "<span style='color:red'>踏浪帅" + index + "</span>"; }); }) </script>
2.3 .appendTo(content)把所有匹配的元素追加到另一个指定的元素元素集合中,参数content用于被追加的内容;[$(A).append(B): 将A追加到B中]
<p>I would like to say: </p> <div></div><div></div> $("p").appendTo("div"); 结果: <div><p>I would like to say: </p></div> <div><p>I would like to say: </p></div>
2.5 .prepend(content) 向每个匹配的元素内部前置内容,参数要插入到目标元素内部前端的内容
<p>I would like to say: </p> $("p").prepend("<b>Hello</b>");--><p><b>Hello</b>I would like to say: </p>
2.6 .prepend(fn) 参数function(index, html)返回一个HTML字符串,用于追加到每一个匹配元素的里边。接受两个参数,index参数为对象在这个集合中的索引值
<div></div> <div></div> <script type="text/javascript"> $(function () { $("div").prepend(function (index) { return "<span style='color:red'>踏浪帅" + index + "</span>"; }); }) </script>
2.7 .prependTo(content) 把所有匹配的元素前置到另一个、指定的元素元素集合中
<p>I would like to say: </p><div id="foo"></div> $("p").prependTo("#foo"); 结果:<div id="foo"><p>I would like to say: </p></div>
相关文章推荐
- Jquery-文档处理学习笔记
- Jquery重新学习之一[加载与属性html(),text(),val()]
- jQuery 学习十(文档处理)
- jquery-选择器、筛选器、样式操作、文本操作、属性操作、文档处理
- jQuery学习笔记 操作jQuery对象 文档处理
- Jquery重新学习之二[属性attr(),removeAttr(),prop(),removeProp()]
- jQuery 学习十(文档处理)
- .JQuery文档分析2--JQuery核心与属性操作
- jQuery学习之八---文档处理
- .JQuery文档分析2--JQuery核心与属性操作
- jQuery入门(3):DOM(选择器,属性,筛选,文档处理)
- jQuery——入门(三)JQuery DOM操作(核心处理和文档处理)
- jQuery:基础学习(2)属性,CSS,文档,元素筛选
- jquery中文档处理的学习
- python学习笔记-Day16-jquery(文档处理/事件/插件)
- jquery选择器,文档处理,属性
- Jquery 基础学习笔记之文档处理
- 《Web编程入门经典》学习笔记 - Lesson01:创建结构化文档:XHTML简介、核心元素、属性组与基本文本格式
- jQuery (选择器,属性,筛选,文档处理)