What is the difference between content selector and form selector in jQuery

This article mainly introduces "what is the difference between content selector and form selector in jQuery". In daily operation, I believe many people have doubts about the difference between content selector and form selector in jQuery. Xiaobian consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful to answer the questions of "what is the difference between content selector and form selector in jQuery?" Next, please follow the editor to study!

Content selector

The filtering rules of the jQuery content filter selector are mainly applied to the child elements or their text content contained in the DOM element, including the following four filtering methods:

Four uses of content selector

Content selector

Select the element with the text content of "text"

Format: E:contains (text)

Include element selector

Select the element that contains the element matched by the selector

Format: E:has (selector)

Empty content selector

Select an empty element without any child elements or text

Format: E:empty

Non-empty content selector

Select an element tag that contains child elements or text

Format: e: parent

Form element selector

The form element is the selector used to get the specified form element, and the form element selector is used to simplify the operation of the form.

Such as:

Select all paragraphs that contain the word "is"

Find all div objects with input tags

Mark all non-empty elements, that is, elements that have child elements or text

Mark all empty elements, that is, elements without child elements or text

Get all the input boxes under the form

All unavailable entries

Selected element

$(function () {/ / use: contains to get the component containing the specified content, filter the component / / $("p:contains (special)"). Css ("border", "1px solid red") in the text content; / / get the tag / / $("div:has (input)"). Css ("border", "1px solid red") that has a descendant node named input. / / using the biggest difference between the cascading selector and the has () selector, the cascading selector selects the input component, while the above has selects the div component / / $("div input"). Css ("border", "1px solid red") that owns the input component; / / use: parent selector to get all non-empty elements / / $("*: parent"). Css ("border", "1px solid red") / / use: empty to get all empty elements / / $("*: empty"). Css ("border", "1px solid red"); / / use: input to get all the elements of the form,: nothing before is * query all / / $(": input"). Css ("border", "1px solid red"); / / $(": input"). Css ("width", "200px") / / $("input,select,button"). Css ("border", "1px solid red"); / / get all buttons / / $(": button,: submit,: reset"). Css ("border", "1px solid red"); / / use: disabled to get unavailable form elements / / $(": disabled"). Css ("border", "1px solid red") / / the following sentence is equivalent to / / $("* [disabled='disabled']"). Css ("border", "1px solid red"); / / get the selected checkbox or check box / / $(": checked"). Css ("width", "100px"); $("* [checked='checked']") .css ("border", "1px solid red") }) at this point, the study on "what is the difference between content selector and form selector in jQuery" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!