jquery學習-屬性選擇器
阿新 • • 發佈:2018-11-27
2.)jquery 屬性選擇器
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="node_modules/jquery/dist/jquery.min.js"></script> </head> <body> <input type="text" value="username"> <input type="text" value="useremail"> <input type="text" value="nodeing_useremail"> <input type="text" value="useremail_nodeing"> <input type="password"> <script> $(function () { // $('input[value]').css('border','1px solid red') //查詢有value屬性的input元素,再設定它css樣式。 // $('input[value=username]').css('border','1px solid green'); //查詢value=username的input元素,再設定它css樣式。 $('input[value*=email]').css('border','1px solid red'); //查詢value屬性裡面包含email這幾個字元input元素,再設定它css樣式。(*表示包含) $('input[value^=nodeing]').css('border','1px solid blue'); //查詢value屬性裡面以nodeing開頭的input元素,再設定它css樣式。(^表示以什麼開頭) $('input[value$=name]').css('border','1px solid green'); //查詢value屬性裡面以name結尾的input元素,再設定它css樣式。($表示以什麼結尾) }); //注:這裡的$(function () {}); 等價於: window.onload = function(){}; </script> </body> </html>