JQ-- selector (attribute form, the form object properties)

1, attribute selector:

<script>
            $(function(){
                $("#btn1").click(function(){
                    $("div[id]").css("background-color","red");
                }); // id attribute of div 
                
                $ ( " # btn2 " ) .click ( function () {
                    $("div[id='two']").css("background-color","red");
                }); // id attribute and the value of the two div 
            });
 </ Script >
. 1  $ ( "div [id]") // all div id attribute elements contained
 2  $ ( "div [id = '123']") // div id attribute value of the element 123
 . 3  $ ( "div [id ! = '123'] ") // id attribute value 123 is not equal to the div element
 . 4  $ (" div [ID = ^ 'qq'] ") // ID attribute value begins qq div element
 . 5  $ (" div [id $ = 'zz'] ") // id attribute value zz div element end
 . 6  $ (" div [ID = * 'bb'] ") // div element containing attribute value ID and bb
 7 $ (" element input [id] [name $ = 'man'] ") // attribute selected from the multiple filters, that satisfies both conditions attributes

2, sheet selectors:

(1) Form:

<form>
            <input type="text" value="1"/><br />
            <input type="text" value="2"/><br />
            <input type="checkbox" /><br />
            <input type="radio" /><br />
            <input type="image" /><br />
            <input type="file" /><br />
            <input type="submit" />
            <input type="reset" /><br />
            <input type="password" value="123456"/><br />
            <input type="button" /><br />
            <select><option/></select><br />
            <textarea></textarea><br />
            <button></button>
        </form>

(2) Specific operation:

. 1  $ ( ": INPUT") // match all input, textarea, select and button element
 2  $ ( ": text") // all line text boxes, $ ( ": text") is equivalent to $ ( "[ type = text] "), is recommended to use $ (" input: text ") more efficient, the same below
 3  $ (": password ") // All password box
 4  $ (": radio ") // All radio button
 5  $ ( ": the checkBox") // all boxes
 6  $ ( ": the submit") // all submit buttons
 7  $ ( ": the rESET") // reset button all
 8  $ ( ": the button") / / All button buttons
 9 $ ( ": file") // all domain file

Select element type = text in input, the result is 2.

            $(function () { 
                $("#btn1").click(function(){
                alert($(':input[type=text]').size()); 
                });
            });

Gets a value in the input box password, the result is: 123456

            $(function () { 
                $("#btn1").click(function(){
                alert($(':input[type=password]').val()); 
                });
            });

3, form object attribute selector:

(1) Form:

        <form>
            <input type="text" value="1"/><br />
            <input type="text" value="2"/><br />
            <input type="checkbox" /><br />
            <input type="radio" /><br />
            <input type="image" /><br />
            <input type="file" /><br />
            <input type="submit" />
            <input type="reset" /><br />
            <input type="password" value="123456"/><br />
            <input type="button" /><br />
        </form>

(2) Specific operation:

. 1  $ ( "INPUT: Enabled") // matching available INPUT
 2  $ ( "INPUT: Disabled") // matching unavailable INPUT
 . 3  $ ( "INPUT: the checked") // matches the checked INPUT
 . 4 $ ( " option: selected ") // match the selected option

Get all the available elements, a value of 10

    $(function () { 
      alert($('form :enabled').size());  
    });

 

Guess you like

Origin www.cnblogs.com/zhai1997/p/12234336.html