Home >Web Front-end >JS Tutorial >Some basic operations of Jquery form value assignment_jquery

Some basic operations of Jquery form value assignment_jquery

WBOY
WBOYOriginal
2016-05-16 18:44:57968browse

Selector with qualified child nodes: $("mix1[mix2]"): Returns the mix1 node containing mix2. For example: $("div[a]"): A div containing the a tag.
This is the same as $(" div a") are not the same. The latter represents the a tag in the div and returns the a tag object. The former returns the div tag object
Colon-qualified node selector: $("mix:condition"):mix tag, and meet the qualifying conditions.
E:root: The type is E, and it is the root element of the document
E:nth-child(n): It is the nth child element of type E of its parent element , the base starts from 1
E:first-child: is the first child element of type E of its parent element
E:last-child: is the last child element of type E of its parent element
E:only-child: and is the only child element of type E of its parent element
E:empty: an element of type E that has no child elements (including text nodes)
E:enabled
E:disabled: User interface elements of type E, allowed or prohibited
E:checked: User interface elements of type E, in selected state (such as radio buttons or check boxes)
E:visible: Select all visible elements (the display value is block or visible, the visibility value is visible elements, excluding the hide field)
E:hidden: Select all hidden elements (non-Hide field, and the display value is block or visible) , elements whose visibility value is visible)
E:not(s): type is E, does not match selector s
E:eq(n),E:gt(n),E:lt(n) :Element qualification
E:first: Equivalent to E:eq(0)
E:last: The last matching element
E:even: Take the even-numbered element from the matched element set
E:odd: Take odd-numbered elements from the matched element set
E:parent: Select all elements that contain child elements (including text nodes)
E:contains('test'): Select all elements containing Elements that specify text
Form selector:
E:input: Select form elements (input, select, textarea, button)
E:text: Select all text areas (type="text")
E:password: select all password fields (type="password")
E:radio: select all radio buttons (type="radio")
E:checkbox: select all checkboxes (type= "checkbox")
E:submit: Select all submit buttons (type="submit")
E:image: Select all image fields (type="image")
E:reset: Select all clear Domain (type="reset")
E:button: Select all buttons (type="button")
Of course including E:hidden

8.xPath path query:

First introduce the syntax of xPath:
/: Select the root node
//: Select all nodes that meet the conditions in the document, no matter where the node is located
.: Select the current node
.. :Select the parent node of a single previous node
@:Select attributes, this has been mentioned before (attribute selector)
nodename:Select all nodes under the node
Application in jQuery:
Root Nodes are rarely used, commonly used examples are as follows:
$("div/p") is equivalent to $("div>p")
$("div//p") is equivalent to $("div p")
$("//div/../p"): The p tag under the parent node of all div nodes
also has relative path writing and supported Axis selectors. I don’t know how to apply it yet, so I won’t introduce it... There are already a lot of other uses of

$:

$ (html node): dynamically created based on the original HTML tag string provided DOM elements wrapped by jQuery objects. For example:
$("Hello").appendTo("#body");//Add Hello to the body element
$(document): Web page document object
$(document.body): Web page body object, which is the same as $("body")
$(function): This function is executed after the DOM is loaded. So $(document).ready() can be written Do $()
$(selector part, selector source): This example illustrates
$("input:radio",document.forms[0]): In the first form of the document, search All radio buttons
$("div",xml.responseXML): Query all div elements in the specified XML document
The selector source can be: DOM element, document or jQuery object as context
Also There are two: $.extend(prop) and $.noConflict() are compatible with plug-ins and other libraries. We will write

drop-down boxes, radio button boxes, and multi-select boxes in the future

1, drop-down box:
var cc1 = $(".formc select[@name='country'] option[@selected]").text(); //Get the text of the selected item in the drop-down menu (Note that there are spaces in the middle)
var cc2 = $('.formc select[@name="country"]').val(); //Get the value of the selected item in the drop-down menu
var cc3 = $ ('.formc select[@name="country"]').attr("id"); //Get the ID attribute value of the selected item in the drop-down menu
$("#select").empty(); //Clear the drop-down box//$("#select").html('');
$("1111").appendTo("#select")//Add the option of the drop-down box
A little explanation Here's a look:
1.select[@name='country'] option[@selected] means the option element with the selected attribute in the select element that has the name attribute,
and the attribute value is 'country';
It can be seen that anything starting with @ means that it is followed by attributes.

2, radio button:
$("input[@type=radio][@checked]").val(); //Get the value of the selected item of the radio button (note the middle No spaces)
$("input[@type=radio][@value=2]").attr("checked",'checked'); //Set the radio button value=2 to the selected state. (Note that there is no space in the middle)

3, check box:
$("input[@type=checkbox][@checked]").val(); //Get the check box selected The value of the first item
$("input[@type=checkbox][@checked]").each(function(){ //Since multiple check boxes are generally selected, the output can be looped
alert($(this).val());
});

$("#chk1").attr("checked",'');//uncheck
$("#chk2").attr("checked",true);//Tick
if($("#chk1").attr('checked')==undefined){} // Determine whether it has been checked

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn