jQuery 获取对象 根据属性、内容匹配, 还有表单元素匹配
发布时间:2020-12-14 22:33:36 所属栏目:资源 来源:网络整理
导读:指定元素中包含 id 属性的,如: $("span[id]") 复制代码 代码如下: span id="span1" name="S1"AAA/spanbr/ span id="span2" name="S2"BBB/spanbr/ span name="Sx3"CCC/spanbr/ span name="Sx4"DDD/spanbr/ div id="div1" name="Dx1"EEE/div div name="D2"FFF/d
指定元素中包含 id 属性的,如: $("span[id]") 复制代码 代码如下: <span id="span1" name="S1">AAA</span><br/> <span id="span2" name="S2">BBB</span><br/> <span name="Sx3">CCC</span><br/> <span name="Sx4">DDD</span><br/> <div id="div1" name="Dx1">EEE</div> <div name="D2">FFF</div> 指定元素中不包含 id 属性的,如: $("span:not(span[id])") 或 $("span:not([id])") 复制代码 代码如下: <span id="span1" name="S1">AAA</span><br/> <span id="span2" name="S2">BBB</span><br/> <span name="Sx3">CCC</span><br/> <span name="Sx4">DDD</span><br/> <div id="div1" name="Dx1">EEE</div> <div name="D2">FFF</div> 包含 id 属性的,如: $("body [id]") 复制代码 代码如下: <span id="span1" name="S1">AAA</span><br/> <span id="span2" name="S2">BBB</span><br/> <span name="Sx3">CCC</span><br/> <span name="Sx4">DDD</span><br/> <div id="div1" name="Dx1">EEE</div> <div name="D2">FFF</div> 符合元素值的,如: $("span[name='S2']") 复制代码 代码如下: <span id="span1" name="S1">AAA</span><br/> <span id="span2" name="S2">BBB</span><br/> <span name="Sx3">CCC</span><br/> <span name="Sx4">DDD</span><br/> <div id="div1" name="Dx1">EEE</div> <div name="D2">FFF</div> 不符合元素值的,如: $("span[name!='S2']") 复制代码 代码如下: <span id="span1" name="S1">AAA</span><br/> <span id="span2" name="S2">BBB</span><br/> <span name="Sx3">CCC</span><br/> <span name="Sx4">DDD</span><br/> <div id="div1" name="Dx1">EEE</div> <div name="D2">FFF</div> 元素值开头是?,如: $("span[name^='S']") 复制代码 代码如下: <span id="span1" name="S1">AAA</span><br/> <span id="span2" name="S2">BBB</span><br/> <span name="Sx3">CCC</span><br/> <span name="Sx4">DDD</span><br/> <div id="div1" name="Dx1">EEE</div> <div name="D2">FFF</div> 元素值结尾是?,如: $("html [name$='1']") 复制代码 代码如下: <span id="span1" name="S1">AAA</span><br/> <span id="span2" name="S2">BBB</span><br/> <span name="Sx3">CCC</span><br/> <span name="Sx4">DDD</span><br/> <div id="div1" name="Dx1">EEE</div> <div name="D2">FFF</div> 元素值包含?,如: $("body [name*='x']") 复制代码 代码如下: <span id="span1" name="S1">AAA</span><br/> <span id="span2" name="S2">BBB</span><br/> <span name="Sx3">CCC</span><br/> <span name="Sx4">DDD</span><br/> <div id="div1" name="Dx1">EEE</div> <div name="D2">FFF</div> 多个属性条件,如(有 id 且 name 开始是 "D"): $("body [id][name^='D']") 复制代码 代码如下: <span id="span1" name="S1">AAA</span><br/> <span id="span2" name="S2">BBB</span><br/> <span name="Sx3">CCC</span><br/> <span name="Sx4">DDD</span><br/> <div id="div1" name="Dx1">EEE</div> <div name="D2">FFF</div> 查找包含 "AB" 的 span: $("span:contains('AB')") 复制代码 代码如下: <span>ABC</span><br/> <span><b>ABC</b></span><br/> <span></span> <div> <span>ABC</span><br/> <span><b>ABC</b></span><br/> <span></span> </div> 从 div 中查找包含 "AB" 的 span: $("div span:contains('AB')") 复制代码 代码如下: <span>ABC</span><br/> <span><b>ABC</b></span><br/> <span></span> <div> <span>ABC</span><br/> <span><b>ABC</b></span><br/> <span></span> </div> 查找包含 的 span: $("span:has('b')") 复制代码 代码如下: <span>ABC</span><br/> <span><b>ABC</b></span><br/> <span></span> <div> <span>ABC</span><br/> <span><b>ABC</b></span><br/> <span></span> </div> 查找空的 span: $("span:empty") 复制代码 代码如下: <span>ABC</span><br/> <span><b>ABC</b></span><br/> <span></span> <div> <span>ABC</span><br/> <span><b>ABC</b></span><br/> <span></span> </div> 查找非空的(也就是作为父元素的) span: $("span:parent") 复制代码 代码如下: <span>ABC</span><br/> <span><b>ABC</b></span><br/> <span></span> <div> <span>ABC</span><br/> <span><b>ABC</b></span><br/> <span></span> </div> :hidden 与 :visible 分别对应隐藏与显示的元素; 下例让已显示的变红,让隐藏的显示为灰色. 复制代码 代码如下: <!doctype html> <html> <head> <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script> </head> <body> <div>111</div> <div>222</div> <div style="display:none">333</div> <div style="display:none">444</div> </body> </html> <script> $("div:visible").css("color","red"); $("div:hidden").css("display","").css("color","silver"); </script> 表单匹配: :input 匹配: <input ... /> <select></select> <textarea></textarea> <button></button> :text 匹配 <input type="text" /> :password 匹配 <input type="password" /> :radio 匹配 <input type="radio" /> :checkbox 匹配 <input type="checkbox" /> :submit 匹配 <input type="submit" /> :reset 匹配 <input type="reset" /> :image 匹配 <input type="image" /> :file 匹配 <input type="" /> :button 匹配 <button></button> :enabled 匹配 所有可用的 input 元素 :disabled 匹配 所有不可用的 input 元素 :checked 匹配 所有选中的被选中复选框、单选框 :selected 匹配 所有选中的 option 元素 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |