Home >Web Front-end >JS Tutorial >What attribute selectors does jquery have?

What attribute selectors does jquery have?

王林
王林Original
2020-11-18 09:54:313860browse

The attribute selectors in jquery are: 1. ID selector; 2. CSS selector; 3. Label selector; 4. Hierarchical selector; 5. Filter selector; 6. Attribute selector; 7. Child element selector; 8. Form selector.

What attribute selectors does jquery have?

Using the $() symbol as a selector in jQuery greatly improves work efficiency.

(Learning video sharing: javascript video tutorial)

Commonly used attribute selectors include the following:

  • 1) $('#id') id selector

  • ##2) $('.class') css selector, class class name

  • 3) $('element') Tag selector, such as p, h1, div

  • ##4) $('*') Full selector, which can select all html tags (affects Useful if the range is large)
  • 5) $('sele1,sele2') Use ',' commas to separate multiple selectors with the same effect from different elements
  • 6) $('div p') Hierarchical selector, commonly used selector, such as p tag under div
  • 7) $(' div>p') is similar to the previous level selector, but there are child elements under the div, and there are grandchild elements under the child elements. This selector can only select child elements
  • ##8) $('div p') This selector is rarely used to indicate that the div is adjacent to the next selector, (it must be the same level element and close to each other)
  • 9) $(' div~p') Elements in the same stage from the beginning of div to all p tags at the end of the stage are selected, excluding the downward elements are p sub-elements
  • 10) $ ('div:first') Filter selector, :first uses: to connect with the parent element, the first div element selected;
  • 11) $('div:last' )Filter selector;:last method is the same as above but selects the last div element;
  • 12) $('li:eq(1)') This selector is also a filter selection Device; use ':eq()' to connect, enter the number in the brackets to choose starting from 0, 0 represents the first position;
  • 13) $('li:contains("text" )') This selector can select, for example: all text elements in the text in li, including the sub-elements under li with text, are selected. text can be the keyword you need; ('text') needs to be added or Double quotes, because it is a string rather than a variable
  • 14) $('li:has("p")') This selector has the same effect as the hierarchical selector and also selects li All the following p tags can be inherited;
  • 15) $('div:hidden') :hiddenThis selector can select some display:none;hidden selectors
  • 16) $('span:visible') On the contrary to :hidden, all span tags are selected, but the span attribute of display:none is not selected
  • 17) $('li[title=book]') Attribute selector, select the element in li with the attribute title=book;
  • 18) $('li[title !=book]') Contrary to the previous one, select the element whose title in li is not, not equal to book;
  • ##19) $('li[title*=k]') Attribute Selector, selects all elements with the word k in all titles in li;

  • 20) $('li:first-child') Child element filter;:first filter The device can get the first child element of the specified parent element, not a collection. It is just the first child element under a li, not all the child elements under li. And first-child gets the first child element returned by each parent element;

  • 21) $('li:last-child') Like the above filter selector, last:child will get the last child element returned by each parent element;

  • 22) $('form :input') The form selector includes input, select, button, textarea,

  • 23) $(' form :text')  Form text selector, this selector only contains type selection

  • 24) $('form :password') The form password selector also only contains the type='password' type in the input,

  • 25) $('form :radio') The radio button selector also only contains type='radio' type in input, 26) $('form:checkbox') checkbox selector, also only contains type='checkbox' type in input

  • 27 ) $('form :submit') Submit button selector, including input type="submit" and button type,

  • 28) $('form :image') Image field Selector. Only the src in the input can take effect. If img src is added to the form, it will not be affected

  • 29) $('form :button') Form button selector. Includes type='button' and < button>valid

  • 30) $('form :checked') Select the state selector, with the selection box radio and checkbox will be selected;

  • 31) $('form :selected') When the selector is selected in the drop-down box, only the option selectors that are selected in the select drop-down list can be obtained;

Related recommendations: js tutorial

The above is the detailed content of What attribute selectors does jquery have?. For more information, please follow other related articles on the PHP Chinese website!

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
Previous article:What is Webix in jqueryNext article:What is Webix in jquery