$(this).attr(&checked&,false);
惯例：我是温浩然：转载，需要在明显位置标注来源：/q/61553/jquery中prop()方法和attr()方法的区别浅析 ： & http://www.jb51.net/article/41170.htm在JS中，checkbox，设置$(this).attr(&checked&,false);但是页面为选中，这里，需要用.prop(&checked&,true);下面先贴代码：下面是JSP代码：&div class=&row&& &div class=&form-group&&
&label class=&col-sm-2 control-label no-padding-right&
for=&form-field-2&& 涉及维度 &/label&
&div class=&col-sm-10&&
&div class=&col-sm-2&&
&label& &input name=&form-field-checkbox&
class=&ace ace-checkbox-2& type=&checkbox& value=&bigMovement& ch=&veidooVideo&&
&span class=&lbl&& 大运动&/span&
&div class=&col-sm-2&&
&label& &input name=&form-field-checkbox&
class=&ace ace-checkbox-2& type=&checkbox& value=&fineMotor& ch=&veidooVideo&&
&span class=&lbl&& 精细运动&/span&
&div class=&col-sm-2&&
&label& &input name=&form-field-checkbox&
class=&ace ace-checkbox-2& type=&checkbox& value=&healthy& ch=&veidooVideo&&
&span class=&lbl&& 健康&/span&
&div class=&col-sm-2&&
&label& &input name=&form-field-checkbox&
class=&ace ace-checkbox-2& type=&checkbox& value=&recognition& ch=&veidooVideo&&
&span class=&lbl&& 认知&/span&
&div class=&col-sm-2&&
&label& &input name=&form-field-checkbox&
class=&ace ace-checkbox-2& type=&checkbox& value=&social& ch=&veidooVideo&&
&span class=&lbl&& 社会&/span&
&div class=&col-sm-2&&
&label& &input name=&form-field-checkbox&
class=&ace ace-checkbox-2& type=&checkbox& value=&languge& ch=&veidooVideo&&
&span class=&lbl&& 语言&/span&
&/div& &/div&&/div&下面是JS代码：var array=[];
$.each(JSON.parse(el.attr('data-veidooMsg')),function(i,el){
array.push(el);
$(&input[ch='veidooVideo']&,$('#editCardModalvideo')).each(function () {
$(this).attr(&checked&,false);
for(i=0;i&array.i++){
if($(this).val()==array[i].name){
$(this).attr(&checked&,true);
});如果不想看其他人的，我下面复制一下，.attr和.prop的区别：jquery1.6中新加了一个方法prop()，一直没用过它，官方解释只有一句话:获取在匹配的元素集中的第一个元素的属性值。大家都知道有的浏览器只要写disabled，checked就可以了，而有的要写成disabled = &disabled&，checked=&checked&，比如用attr(&checked&)获取checkbox的checked属性时选中的时候可以取到值,值为&checked&但没选中获取值就是undefined。jq提供新的方法“prop”来获取这些属性，就是来解决这个问题的，以前我们使用attr获取checked属性时返回&checked&和&&,现在使用prop方法获取属性则统一返回true和false。那么，什么时候使用attr()，什么时候使用prop()？1.添加属性名称该属性就会生效应该使用prop();2.是有true,false两个属性使用prop();3.其他则使用attr();项目中jquery升级的时候大家要注意这点！以下是官方建议attr(),prop()的使用：Attribute/Property.attr().prop()accesskey√&align√&async√√autofocus√√checked√√class√&contenteditable√&draggable√&href√&id√&label√&location ( i.e. window.location )√√multiple√√readOnly√√rel√&selected√√src√&tabindex√&title√&type√&width ( if needed over&.width()&)√
无相关信息
最新教程周点击榜
微信扫一扫16218人阅读
JQuery & JQuery Mobile
　　做前端开发的，免不了的要操作页面HTML代码，JQuery中提供了许多非常便捷的方法，使我们很方便的操作HTML代码，这也许就是选择JQuery的原因吧。
　　那么让我们来看看有常用的有哪些方法：
html方法，给元素添加html代码或者清空html代码（参数为空字符串）；
append向元素的末尾添加html代码；
appendTo这个方法跟append方法的很像，只是要添加的html代码的目标有所不一样；
after向元素的后边添加html代码，如果元素后面有元素了，那将后面的元素后移，然后将html代码插入；before向元素的前边添加html代码，如果元素前面有元素了，那将前面的元素前移，然后将html代码插入；
insertAfter将JQuery封装好的元素插入到指定元素的后面，如果元素后面有元素了，那将后面的元素后移，然后将JQuery对象插入；
insertBefore将JQuery封装好的元素插入到指定元素的前面，如果元素前面有元素了，那将前面的元素前移，然后将JQuery对象插入；
empty清空元素内部的html代码，它只是清空内部的html代码，但是标记仍然留在DOM中；
remove从DOM中移除整个元素；
　　需要指出的重要的一点：JQuery会自动的完善html代码，也就是说，假如你要执行以下操作
$('content').append('&p&CSDN');那么实际插入到标记中的html代码是
&p&CSDN&/p&
　　这一点需要特别注意，很多教程之类的只是讲解这些函数的动作，但是会忽略一些细节；
　　下面让我来详细解释一下每个函数的作用以及它是如何工作的，会产生什么效果。以后的代码我都对这样的一个模板来操作，代码以及效果如下：
&style type=&text/css&&
height:100
padding:10
text-align:
text-align:
&/style&&div id=&top& class=&box&&
&span&top&/span&
&div id=&middle& class=&box&&
&span&middle&/span&
&div id=&bottom& class=&box&&
&span&bottom&/span&
　　原始的效果图：
　　一、html函数的使用
　　我们执行以下语句：
$('#middle').html('&div class=&child&&html()');
　　效果图如下：
　　再来看看最终的代码：
　　这里是完整的html代码，也就是说JQuery为我们补全了代码，这一点需要注意，JQuery为我们带来了方便，但是当我们需要精确控制html代码的时候，需要注意一点。
　　html函数的作用原理首先是移除目标元素内部的html代码，然后将新代码添加到目标元素。
二、append、appendTo函数的使用
　　执行以下语句：$('#middle').append('&div class=&child&&append()&/div&');　　注：为了编程规范，html代码我之后都使用完整的html标记。
　　效果图如下：
　　最终的代码：
　　append函数将html附加到了&span&middle&/span&之后。
　　appendTo函数的效果和append一样，只不过是写法不一样：$('&div class=&child&&append()&/div&').appendTo('#middle');　　appendTo首先将html代码封装成jquery对象，然后添加到指定的目标位置。
三、after、insertAfter函数的使用
　　执行以下语句：$('#middle').after('&div class=&child&&after()&/div&');　　效果图：
　　after函数的作用是将html代码插入指定元素的后面，如果后面有元素，则将其后移，然后插入html代码。
　　insertAfter函数与after函数的作用是一样的，上面代码的insertAfter版本为：$('&div class=&child&&after()&/div&').after('#middle');　　四、before、insertBefore函数的使用
　　这连个函数的原理与after、insertAfter是一样的，只不过before、insertBefore是插入到目标元素的前面，大家可以自行参考after、insertAfter。
　　五、empty、remove函数的使用
　　执行以下代码：$('#middle').empty();　　效果图：
　　再来看看最终的html代码：&div id=&middle& class=&box&&&/div&　　里面的html代码被清空了，然而元素本身还在。
　　执行以下语句：$('#middle').remove();　　效果图：
　　最终的html代码：&div id=&top& class=&box&&
&span&top&/span&
&div id=&bottom& class=&box&&
&span&bottom&/span&
&/div&　　中间的元素整个被删除了，也就是说remove方法将目标元素整个的从DOM中移除。
　　初次写博文，有什么不对的大家都指出哈，一起学习。
　　以后我将更新一些JQuery Mobile方面的开发知识，大家多多关注。
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：16368次
排名：千里之外jQuery基础(一)
1.基本选择器：基本选择器是Jquery中最常用的选择器，也是最简单的选择器，他通过元素id、class和标签名等来查找DOM元素。在网页中，每个id名称只能使用一次，class允许重复使用。
& 根据给定的id匹配一个元素
&$("#test")选取id为test的元素
&根据给定的类名匹配元素 &
&$(".test")选取所有class为test的元素
element & 根据给定的元素名匹配元素
&$("p")选取所有的元素
& 匹配所有元素 & &
& &$("*")选取所有的元素
selector1,selector2,...selectorN
&$("div,span,p.myClass")选取所有,和拥有class为myClass的标签的一组元素
2.层次选择器：通过DOM元素之间的层次关系来获取特定元素，例如后代元素、子元素、相邻元素和同辈元素等。
$("ancestor descendant") &
选取ancestor元素里的所有descendant(后代)元素 &
span")选取里的所有的元素
$("parent&child")选取parent元素下的child(子)元素，与$("ancestor
descendant")有区别，$("ancestor descendant")选择的是后代元素 &
$("div&span")选取
元素下元素名是的子元素
$("prev+next")
&选取紧接在prev元素后的next元素 &
$(".one+div")选取class为one的下一个
同辈元素。
$("prev~siblings")选取prev元素之后的所有siblings元素
&$("#two~div")选取id为two的元素后面的所有
同辈元素。
3.过滤选择器
1.基本过滤选择器
a.:first & 选取第一个元素
& & $("div:first")选取所有
元素中第一个 & &
&选取最后一个元素 &
$("div:last")选取所有
元素中最后一 & &
c.:not(selector) 去除所有与给定选择器匹配的元素
$("input:not(.mayclass)")选取class不是myClass元素
d.:even/:odd选取索引是偶数/奇数的所有元素
e.:eq(index)/gt(index)/lt(index)选取索引等于/大于/小于index的元素
f.:header & 选取所有的标题元素
& $(":header")选取网页中所有的
g.:animated
&选取当前正在执行动画的所有元素 &
$("div:animated")
&选取当前获得焦点的元素 &
2.内容过滤选择器
a.:contain(text) &
选取含有文本内容为text的元素 &
$("div:contains('我')")选取含有文本‘我’的div元素
b.:empty 选取不包含子元素或文本的空元素
&$("div:empty")选取不包含子元素的空元素
c.:has(selector)选取含有选择器所匹配的元素的元素
&$("div:has(p)")选取含有元素的元素
d.:parent & &
&选取含有子元素或文本的元素 &
$("div:parent")选取拥有子元素（包括文本元素）的元素
3.可见性过滤选择器
a.:hidden &
&选取所有不可见的元素
b.:visible & 选取所有可见的元素
& $("div:visible")选取所有可见的元素
4.属性过滤选择器：通过元素的属性来获取相应的元素
a.[attribute] &
& 选取拥有此属性的元素 &
$("div[id]")选取拥有属性id的元素 & &
$("div[id]")选取拥有属性id的元素
b.[attribute=value] &
&选取属性值为value的元素 &
$("div[title=test]")选取属性title为"test"的元素
c.[attribute!=value] 不等于value
& [attribute^=value]
以value开始的元素
& [attribute$=value]
以value结束的元素
& [attribute*=value]
含有value的元素
& [attribute|=value]
选取属性等于给定字符串或以该字符串为前缀的元素&
& [attribute~=value]
选取属性用空格分隔的值中包含一个给定值得元素
[attribute1][attribute2][attributeN]
5.子元素过滤选择器
a.:nth-child(index/even/odd/equation)
选取每个父元素下的第index个子元素或奇偶元素（index从1算起）
b.:first-child & 选取每个父元素的第一个子元素
& &$("ul li:first-child")
选取每个中第一个元素
c.:last-child &
&选取每个父元素的最后一个子元素
d.only-child &
如果某个元素是它父元素中唯一的子元素，那么将会被匹配。如果父元素中含有其它元素，则不会被匹配。
6.表单对象属性过滤选择器
a. :enable/disabled
&选取所有可用/不可用元素 &
& $("#form1 :enabled") 选取id
为form1的表单内的所有可用/不可用元素
b. :checked &
&选中所被选中的元素（单选框、多选框）
$("input:checked")
c. :selected &
&选取所有被选中的选项元素 &
&$("select option:selected")
7. 表单选择器
&:input &:text
& :password &:radio
& :checkbox &:submit
&:reset &:button
二.插入节点
append() & &
& 向每个匹配的元素内部追加内容
appendTo() & &
将所有匹配的元素追加到指定的元素中
&$(A).appendTo(B)将A追加到B
prepend() & &
&向每个匹配的元素内部前置内容
prependTo() &
&将所有匹配的元素前置到指定的元素中
after() & &
&在每个匹配的元素之后插入内容
insertAfter()
&将所有匹配的元素插入到指定元素的后面
before() & &
& 在每个匹配元素之前插入内容
insertBefore()
将所有匹配的元素插入到指定的元素的前面
三.detach()和remove()一样，也是从DOM中去掉所有匹配的元素，但detach()不会把匹配的元素从JQuery对象中删除，因而可以在将来再使用这些元素。
与remove()不同的是，所有绑定的事件、附加的数据等都会保存下来。
四.clone()复制节点后，被复制的新元素不具有任何行为。clone(true)含义是
复制元素的同时复制元素中所绑定的事件。&
五.replaceWith():将所有匹配的元素都替换成指定的HTML或者DOM元素
&replaceAll():颠倒了replaceWith()的用法。
六.wrap():将某个节点用其他元素包裹起来。
&wrapAll():将所有匹配的元素用一个元素来包裹。它不同于wrap(),wrap()方法是将所有的元素进行单独的包裹。
&wrapInner():将每一个匹配的元素的子内容（包括文本节点）用其他结构化的标记包裹起来。
七.removeAttr():删除元素属性
&attr():获取属性
八.attr("class") 获取元素的class
&addClass()追加样式
&如果给一个元素添加了多个class值，就相当于合并了它们的样式。
&如果有不同的class设定了同一样式属性，则后者覆盖前者。
&removeClass() & $p.removeClass("
high another");同时移除多个
九.toggle():主要控制行为上的重复切换，如果元素原来是隐藏的则显示它，
&如果原来是显示的则隐藏它。
十.hasClass()
判断元素中是否含有某个class,如果有返回true.
十一.遍历节点
a.children():取得匹配元素的子元素集合。children()方法只考虑子元素不考虑其他后代元素。
b.next():取得匹配元素后面紧邻的同辈元素。
c.prev():取得匹配元素前面紧邻的同辈元素。
d.siblings():取得匹配元素前后所有的同辈元素（除他自身）。
e.closet():取得最近的匹配元素。首先检查当前元素是否匹配，如果匹配则直接返回元素本身。如果不匹配则
&向上查找父元素，逐级向上直到找到匹配选择器的元素。如果什么都没有，返回一个空的JQuery对
f.find()/filter()/nextAll()
十二.$(document).ready()方法和window.onload()方法有相似的功能，但是在执行时机方面有区别。
window.onload()是在网页中所有元素完全加载到浏览器后才执行，即JavaScript此时才可以访问页面中
的任何元素。而通过jQuery中的$(documnent).ready()方法注册的事件处理程序，在DOM完全就绪时就可
以被调用。
JavaScript的onload事件一次只能保存对一个函数的引用，它会自动用后面的函数覆盖前面的函数，因此
不能在现有的行为上添加新的行为。而$(document).ready()方法会在现有的行为上添加新的行为。这些
行为函数会根据注册的顺序依次执行。
十三.jQuery有两个合成事件——hover()方法和toggle()方法。
&hover(enter,leave)方法用于模拟光标悬停事件。当光标移动到元素上时，会触发指定的第一个函数
（enter）;当光标移出这个元素时，会触发指定的第二个函数(leave)。
$(function(){
& & &$("#panel
h5.head").hover(function(){
&$(this).next().show();
&},function(){
&$(this).next().hide();&
&toggle()方法用于模仿鼠标连续单击事件。第一次单击元素时，触发指定的第一个函数；当再次点击同一
&元素时，则触发指定的第二个函数。最常用的是切换元素的可见状态。如果元素时可见的，单击切换后则
&为隐藏；如果元素时隐藏的，单击切换后则为可见的。
十四.事件冒泡：事件会按照DOM的层次结构像水泡一样不断向上直至顶端。
&事件对象：event
&阻止事件冒泡：stopPropagation() &
&event.stopPropagation();&
十五.阻止默认行为：网页中的元素有自己的默认行为，例如单击超链接后会跳转、单击“提交”按钮后表单会
&提交，有时需要阻止元素的默认行为。preventDefault()方法来阻止元素的默认行为。return
&现同样功能。
十六.事件捕获：和事件冒泡是刚好相反的两个过程，事件捕获从最顶端往下开始触发。但
jQuery不支持事件捕 & &
&获，如果需要使用事件捕获，直接使用原生的JavaScript。
十七.事件对象的属性:
&event.type：获取到事件的类型。
&event.preventDefault():阻止默认的事件行为。
&event.stopPropagation():阻止事件的冒泡。
&event.target:获取到触发事件的元素。
&event.relatedTarget
&event.pageX/event.pageY:获取到光标相对于页面的x坐标和y坐标。
&event.which:在鼠标单击事件中获取到鼠标的左、中、右键；在键盘事件上获取键盘的按键。
&event.metaKey:在jQuery中获取按键。
十八.移出以前注册过的事件unbind() &
$("#test").unbind("click",myFunc2); &另外对于只需要触发一次，
&随后就要立即解除绑定的情况，jQuery提供的简写方法是one()函数。当处理函数触发一次后，立即被删
&除。使用方法和bind()类似。
十九.常用模拟：需要通过模拟用户操作，来达到单击的效果。在jQuery中，可以使用trigger()方法完成模拟操
&$("#btn").trigger("click"); &
简化写法：$("#btn").click();
触发自定义事件：trigger()方法不仅能触发浏览器支持的具有相同名称的事件，也可以触发自定义名
称的事件。
$('#btn').trigger("myClick",["我的自定义","事件"]);
执行默认操作：如果只想触发绑定的focus事件，而不想执行浏览器的默认操作，可以使用jQuery中另一
个类似的方法triggerHandler()。
二十.可以把元素绑定否认多个事件类型用命名空间规范起来。可以为元素绑定相同的事件类型，然后以命名空
&间的不同按需调用。
&$(function(){
$("div").bind("click",function(){
$("body").append("
$("div").bind("click.plugin",function(){
$("body").append("
click.plugin事件
$("button").click(function(){
$("div").trigger("click!"); &
//！匹配所有不包含在命名空间中的click方法
二十一.JQuery中的动画效果（用jQuery做动画效果要求在标准模式下，否则可能会引起动画抖动，标准
&模式即要求文件头部包含如下的DTD定义） ：
&&!DOCTYPE
html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
二十二.show()/hide() & 显示/隐藏
&fadeOut()/fadeIn()
&slideUp()/slideDown() &
通过改变元素的高度由上至下延伸显示/由下至上缩短隐藏。
&自定义动画方法 animate（param,speed,callback）;
&{left:"500px"}改为{left:"+=500px"}或&{left:"-=500px"}表示在当前位置累加500px或累
&减500px。
&如果需要动画按顺序方式执行写开就可以。
&$(this).animate({left:"500px"},3000);
&$(this).animate({height:"200px"},3000);
二十三.综合动画：单击div后让它向右移动的同时增大它的高度，并将它的不透明度从50% 变换到
&100%，然后再让它从上到下移动，同时它的宽度变大，当完成这些效果后，让它以淡出的方式隐
&$(function(){
&$("panel").css("opacity","0.5");
&//设置不透明度
&$("panel").click(function(){
$(this).animate({left:"400px",height:"200px",opacity:"1"},3000)
&.animate({top:"200px",width:"200px"},3000)
&.fadeOut("slow");
二十四.停止元素的动画
&stop([clearQueue],[gotoEnd])其中
clearQueue代表是否要清空未执行玩 & &
的动画队列，gotoEnd代表是否直接将正在执行的动画跳转到末状态。
&stop()方法会结束当前正在进行的动画，并立即执行队列中的下一个动画。
&$("#panel").hover(function(){
&$(this).stop().animate({hieght:"150",width:"300"},200);
},function(){
&$(this).stop().animate({height:"22",width:"60"},300);
如果遇到组合动画，例如：
&&$("#panel").hover(function(){
&$(this).stop().animate({hieght:"150"},200)
&.animate({width:"300"},300);
},function(){
&$(this).stop().animate({height:"22"},200)
&.animate({width:"60"},300);
});此时在用一个无参的stop()方法就显得力不从心了。因为stop(）方法只会停止正在进行的 &
动画，如果动画正在执行第一阶段（改变height的阶段），则触发光标移出事件后，只会停止 &
当前的动画，并继续进行下面的aniamte({widht:"300"},300)动画，而光标移出事件中的动画
& 要等这个动画结束后才会继续执行，这显然不是预期的结果。这时可以把stop()的第一个参数
(clearQueue)设置为true,此时程序会把当前元素接下来尚未执行完的动画队列都清空。
&&$("#panel").hover(function(){
&$(this).stop(true).animate({hieght:"150"},200)
&.animate({width:"300"},300);
},function(){
&$(this).stop(true).animate({height:"22"},200)
&.animate({width:"60"},300);
stop()的第二个参数可以让正在执行的动画直接到达结束时刻的状态，通常用于后一个动画需 &
要基于前一个动画的末状态的情况，可以通过stop(false,true)这种方式来让当前动画直接到
& 达末状态。
&stop（true，true）停止当前动画直接到达当前动画的末状态，并清空动画队
jQuery()只能设置正在执行的动画的最终状态，而没有提供直接到达未执行动画队列最终状态 &
二十五.判断元素是否处于动画状态：在使用animate()方法时，要避免动画积累而导致的动画与用户行
&为的不一致。当用户快速在某个元素上执行animate()动画时，就会出现动画积累。解决方法是
&判断元素是否正处于动画状态，如果元素不处于动画状态，才为元素添加新的动画。
&if(!$(element).is(":animated")){
& //判断元素是否正处于动画状态
//如果当前没有进行动画，则添加新动画&
二十六.delay()对动画进行延迟操作。
二十七.slideToggle()：通过高度变化来切换匹配元素的可见性，相当于slideUp()和 slideDown（）
的联合使用。
fadeTo():可以把元素的不透明度以渐进方式调整到指定的值。
fadeToggle():通过不透明度变化来切换匹配元素的可见性。 相当于fadeOut()和fadeIn()的连
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。Alibaba&Manufacturer&Directory&-&Suppliers,&Manufacturers,&Exporters&&&Importers&（责任编辑：）
友情链接:联系人：QQ