Some basic operations for assigning values to Jquery forms

Source: Internet
Author: User

Limited stator node selector: $("mix1 [mix2]"): returns the mix1 node containing mix2. For example: $ ("div [a]"): div containing the tag.
This is not the same as $ ("div a"). The latter indicates the tag in the div and returns the tag object. The former returns the div tag object.
Colon limit node selector: $ ("mix: condition"): mix label, and meet the conditions.
E: root: the type is E and is the root element of the document.
E: nth-child (n): A child element whose nth type is E. The base number starts from 1.
E: first-child: it is the first child element of its parent element of Type E.
E: last-child: A child element whose last type is E.
E: only-child: And is the only child element of its parent element of the Type E.
E: empty: Elements of the E type without child elements (including text nodes)
E: enabled
E: disabled: user interface elements that are allowed or prohibited if the type is E.
E: checked: selected user interface elements (such as single-choice buttons or check boxes) of the E type)
E: visible: select all visible elements (the display value is block or visible, and the visibility value is visible, excluding the hide field)
E: hidden: select all hidden elements (elements with a non-Hide field and a display value of block or visible and a visibility value of visible)
E: not (s): Type E, unmatched selector s
E: eq (n), E: gt (n), E: lt (n): element limitation
E: first: equivalent to E: eq (0)
E: last: The last matched element.
E: even: obtains an element whose ordinal number is an even number from the Matching Element Set.
E: odd: obtains an odd number of elements from the Matching Element Set.
E: parent: select all elements that contain child elements (including text nodes)
E: contains ('test'): select all elements containing the specified text
Form selector:
E: input: select form elements (input, select, textarea, button)
E: text: select all text fields (type = "text ")
E: password: select all password domains (type = "password ")
E: radio: select all radio buttons (type = "radio ")
E: checkbox: select all check boxes (type = "checkbox ")
E: submit: select all submit buttons (type = "submit ")
E: image: select all image domains (type = "image ")
E: reset: select all clearing fields (type = "reset ")
E: button: select all buttons (type = "button ")
Of course, this includes E: hidden.

8. xPath path query:

First, we will introduce the xPath Syntax:
/: Select the root node
// Select all qualified nodes in the document, no matter where the node is located
.: Select the current node
...: Select the parent node of the previous Node
@: Select attributes. As mentioned earlier (attribute selector)
Nodename: select all nodes under the node
Applications in jQuery:
The root node is rarely used. The following examples are commonly used:
$ ("Div/p") is equivalent to $ ("div> p ")
$ ("Div // p") is equivalent to $ ("div p ")
$ ("// Div/../p"): p tag under the parent node of all div nodes
There are also relative paths and supported Axis selectors, which will not be applied yet. I will not introduce them anymore...

Other usage of $:

$ (Html node): dynamically creates DOM elements encapsulated by jQuery Objects Based on the supplied original HTML Tag string. For example:
$ ("Hello"). appendTo ("# body"); // Add Hello to the body element.
$ (Document): webpage document Object
$ (Document. body): The webpage body object, which is the same as $ ("body ").
$ (Function): this function is executed after DOM is loaded. Therefore, $ (document). ready () can be written as $ ()
$ (Selector part, selector source): This example
$ ("Input: radio", document. forms [0]): In the first form of the document, search for all radio buttons.
$ ("Div", xml. responseXML): queries all div elements in a specified XML document.
The selector source can be a DOM element as the context, a document or jQuery object.
There are two more: $. extend (prop) and $. noConflict () are compatible with plug-ins and other libraries, and will be written later

Drop-down box, single-choice, multi-choice box sorting

1. drop-down box:
Var C0 = $ (". formc select [@ name = 'country'] option [@ selected] "). text (); // get the text of the selected item from the drop-down menu (note that there is a space in the middle)
Var cc2 = $ ('. formc select [@ name = "country"]'). val (); // obtain the value of the selected item from the drop-down menu.
Var cc3 = $ ('. formc select [@ name = "country"]'). attr ("id"); // obtain the ID attribute value of the selected item from the drop-down menu
$ ("# Select"). empty (); // clear the drop-down box // $ ("# select" example .html ('');
$ ("1111"). appendTo ("# select") // Add the option in the drop-down box
A little explanation:
1. select [@ name = 'country'] option [@ selected] indicates that the name attribute exists,
In addition, the select element with the selected attribute in the 'country' select element has the selected attribute;
It can be seen that the attribute is followed by the @ parameter.

2, single region:
$ ("Input [@ type = radio] [@ checked]"). val (); // obtain the value of the selected item of a single sequence (note that there is no space in the middle)
$ ("Input [@ type = radio] [@ value = 2]"). attr ("checked", 'checked'); // set single checked value = 2 to the selected status. (Note that there is no space in the middle)

3. Check box:
$ ("Input [@ type = checkbox] [@ checked]"). val (); // obtain the value of the first check box.
$ ("Input [@ type = checkbox] [@ checked]"). each (function () {// Since multiple check boxes are selected, You can output them cyclically.
Alert ($ (this). val ());
});

$ ("# Chk1"). attr ("checked", ''); // do not check
$ ("# Chk2"). attr ("checked", true); // check
If ($ ("# chk1"). attr ('checked') = undefined) {}// you can check whether a check has been performed.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.