<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jquery属性选择器</title> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <script> //$('input[属性名]') 选择含有某个属性值的元素 //$('input[attr=value]') 选择属性值等于某个值的元素 //$('input[attr!=value]') 选择属性值不等于某个值的元素 //$('input[attr^=value]') 选择属性值开头等于某个值的元素 //$('input[attr$=value]') 选择属性值结尾等于某个值的元素 //$('input[attr*=value]') 选择属性值结尾等于某个值的元素 //$('attSel[1] attSel[2] attSel[3]') 多重选择器,要求同时满足才能选择上 $(document).ready(function(){ $('input[type]').css('background','red'); $('input[type=password]').css('background','blue'); $('input[name!=hhe]').css('background','#ccc'); $('input[name^=t]').css('background','pink'); $('input[name$=e]').css('background','black'); $('input[type*=pa]').css('background','green'); $('input[type*=pa] input[name*=hhh]').css('background','gray'); }) </script> </head> <body> <form action=""> <input type="text" name="hhe"><br/> <input type="password" name="thja"><br/> <input type="password" name="hhh"><br/> <input ><br/> <input type="text"><br/> </form> </body> </html>
点击 "运行实例" 按钮查看在线实例