input属性checked？input checked属性
很多朋友对于input属性checked和input checked属性不太懂，今天就由小编来为大家分享，希望可以帮助到大家，下面一起来看看吧！
input标签checked= false是什么意思
首先JS中的checked是<input type="checkbox">和<input type="radio">的一种属性，表示该项是不是被选择了。
它是有两种定义方式的分别是：
一、在input标签中定义：
1.<input type="checkbox" checked=true>表示该项被选择。
2.<input type="checkbox">表示该项不被选择。
注意：如果是不被选择就不用写checked属性了。如果你写了，不管checked的值是什么，都是被选择。原因：html是一种宽松的标记语言，会忽略你的checked=false中的false，所以结果还是被选中。
二、在加载的javascript中设置：
1.objs[i].checked=true的意思就是该input元素的checked的值是true，就是该input被选中。
2.objs[i].checked=false的意思就是该input元素的checked的值是false，就是该input不被选中。
你那个既然把所有的input元素都遍历了一遍，然后又都给了true值，也就是全选了。
jQuery中attr和prop在修改checked属性时的区别
没有太大区别。一般情况下具有 true和 false两个属性的属性，如 checked, selected或者 disabled使用prop()，其他的使用 attr()。
以下来自网络，有兴趣可阅读：
jQuery1.6开始新增了一个方法prop()。
从中文意思看，两者分别是获取/设置attributes和properties的方法，那么为什么还要增加prop()方法呢？
BeforejQuery1.6,the.attr()methodsometimestookpropertyvaluesintoaccountwhenretrievingsomeattributes,whichcouldcauseinconsistentbehavior.
因为在jQuery1.6之前，使用attr()有时候会出现不一致的行为。
那么，什么时候使用attr()，什么时候使用prop()？
ToretrieveandchangeDOMpropertiessuchasthechecked,selected,ordisabledstateofformelements,usethe.prop()method.
根据官方的建议：具有true和false两个属性的属性，如checked,selected或者disabled使用prop()，其他的使用attr()
到此，将attr('checked')改成prop('checked')即可修复提的issues了。
^_^
等等，貌似问题还没真正解决，为什么开头例子中jQuery1.8.3和1.9.0使用attr()会有所区别呢？
想知道他们的区别，最好的办法还是看他们的源代码：
1.8.3attr()：
attr:function(elem,name,value,pass){
varret,hooks,notxml,
nType=elem.nodeType;
//don'tget/setattributesontext,commentandattributenodes
if(!elem||nType===3||nType===8||nType===2){
return;
}
if(pass&&jQuery.isFunction(jQuery.fn[name])){
returnjQuery(elem)[name](value);
}
//Fallbacktopropwhenattributesarenotsupported
if(typeofelem.getAttribute==="undefined"){
returnjQuery.prop(elem,name,value);
}
notxml=nType!==1||!jQuery.isXMLDoc(elem);
//Allattributesarelowercase
//Grabnecessaryhookifoneisdefined
if(notxml){
name=name.toLowerCase();
hooks=jQuery.attrHooks[name]||(rboolean.test(name)?boolHook:nodeHook);
}
if(value!==undefined){
if(value===null){
jQuery.removeAttr(elem,name);
return;
}elseif(hooks&&"set"inhooks&¬xml&&(ret=hooks.set(elem,value,name))!==undefined){
returnret;
}else{
elem.setAttribute(name,value+"");
returnvalue;
}
}elseif(hooks&&"get"inhooks&¬xml&&(ret=hooks.get(elem,name))!==null){
returnret;
}else{
ret=elem.getAttribute(name);
//Non-existentattributesreturnnull,wenormalizetoundefined
returnret===null?
undefined:
ret;
}
}
1.9.0attr()：
attr:function(elem,name,value){
varret,hooks,notxml,
nType=elem.nodeType;
//don'tget/setattributesontext,commentandattributenodes
if(!elem||nType===3||nType===8||nType===2){
return;
}
//Fallbacktopropwhenattributesarenotsupported
if(typeofelem.getAttribute==="undefined"){
returnjQuery.prop(elem,name,value);
}
notxml=nType!==1||!jQuery.isXMLDoc(elem);
//Allattributesarelowercase
//Grabnecessaryhookifoneisdefined
if(notxml){
name=name.toLowerCase();
hooks=jQuery.attrHooks[name]||(rboolean.test(name)?boolHook:nodeHook);
}
if(value!==undefined){
if(value===null){
jQuery.removeAttr(elem,name);
}elseif(hooks&¬xml&&"set"inhooks&&(ret=hooks.set(elem,value,name))!==undefined){
returnret;
}else{
elem.setAttribute(name,value+"");
returnvalue;
}
}elseif(hooks&¬xml&&"get"inhooks&&(ret=hooks.get(elem,name))!==null){
returnret;
}else{
//InIE9+,Flashobjectsdon'thave.getAttribute(#12945)
//Support:IE9+
if(typeofelem.getAttribute!=="undefined"){
ret=elem.getAttribute(name);
}
//Non-existentattributesreturnnull,wenormalizetoundefined
returnret==null?
undefined:
ret;
}
}
1.8.3和1.9.0的prop()是一样的:
prop:function(elem,name,value){
varret,hooks,notxml,
nType=elem.nodeType;
//don'tget/setpropertiesontext,commentandattributenodes
if(!elem||nType===3||nType===8||nType===2){
return;
}
notxml=nType!==1||!jQuery.isXMLDoc(elem);
if(notxml){
//Fixnameandattachhooks
name=jQuery.propFix[name]||name;
hooks=jQuery.propHooks[name];
}
if(value!==undefined){
if(hooks&&"set"inhooks&&(ret=hooks.set(elem,value,name))!==undefined){
returnret;
}else{
return(elem[name]=value);
}
}else{
if(hooks&&"get"inhooks&&(ret=hooks.get(elem,name))!==null){
returnret;
}else{
returnelem[name];
}
}
}
首先，我们看下attr()和prop()的区别：
attr()里面，最关键的两行代码
elem.setAttribute(name,value+"");
ret=elem.getAttribute(name);
很明显的看出来，使用的DOM的APIsetAttribute()和getAttribute()方法操作的属性元素节点。
prop()里面，最关键的两行代码
return(elem[name]=value);
returnelem[name];
可以理解为document.getElementById(el)[name]=value，这是转化成element的一个属性。
对比调试1.9.0和1.8.3的attr()方法，发现两者的区别在于
hooks.get(elem,name))
返回的值不一样，具体的实现：
1.8.3中
boolHook={
get:function(elem,name){
//Alignbooleanattributeswithcorrespondingproperties
//Fallbacktoattributepresencewheresomebooleansarenotsupported
varattrNode,
property=jQuery.prop(elem,name);
returnproperty===true||typeofproperty!=="boolean"&&(attrNode=elem.getAttributeNode(name))&&attrNode.nodeValue!==false?
name.toLowerCase():
undefined;
}
}
1.9.0中
boolHook={
get:function(elem,name){
var
//Use.proptodetermineifthisattributeisunderstoodasboolean
prop=jQuery.prop(elem,name),
//Fetchitaccordingly
attr=typeofprop==="boolean"&&elem.getAttribute(name),
detail=typeofprop==="boolean"?
getSetInput&&getSetAttribute?
attr!=null:
//oldIEfabricatesanemptystringformissingbooleanattributes
//andconflateschecked/selectedintoattroperties
ruseDefault.test(name)?
elem[jQuery.camelCase("default-"+name)]:
!!attr:
//fetchanattributenodeforpropertiesnotrecognizedasboolean
elem.getAttributeNode(name);
returndetail&&detail.value!==false?
name.toLowerCase():
undefined;
}
}
由此可见，1.9.0开始不建议使用attr()来对具有true和false两个属性的属性进行操作了。
那么我们的结论是：
具有true和false两个属性的属性，如checked,selected或者disabled使用prop()，其他的使用attr()，具体见下表：
浅析jquery与checkbox的checked属性的问题
1、页面加载成功后，点击选中或取消选中该checkbox，checkbox属性里的checked属性不会根据该checkbox是否选中而变化
2、checkbox里的onchange或onclick方法里用jquery的attr方法获取checked是看得到的checked属性的值与它是否给钩上没有关系
3、使用document.getElementById("checkbox_id").checked获取的值与是否钩上一至，即与所见即所得
4、使用$("#checkbox_id").attr("checked")获取的值与<input
type="checkbox"></input>里的checked情况一至，不是所见即所得
5、使用$("#checkbox:checked")获取的都是被钩上的checkbox
6、document.getElementById("checkbox_id").checked=true，控件里的checked属性没有显示出来，所做即所见
7、$("#checkbox_id").attr("checked"，true)，控件里的checked属性显示出来，所做即所见，同时代码也会变化
以上这篇浅析jquery与checkbox的checked属性的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
好了，文章到此结束，希望可以帮助到大家。