Home > Developer > Web Develop
Let's take a look at how we handle element selection without jquery.
When JavaScript selects an element, it can get the element based on the ID, and when the ID does not exist, the result is null, and the console reports the script execution error.
So the general practice is to first use an if to determine the existence of the element.
Like what:
<Body><a>Click Me</a><Scripttype= "Text/javascript"> //document.getElementById ("Someid"). Style.color = "Red";//if ID does not exist,report error in console. if(document.getElementById ("Hello")) {//ensure it ' s neither null nor undefined.document.getElementById ("Hello"). Style.color= "Red"; }</Script></Body>
jquery Selection manipulation elements
jquery gets the element with the $ () operator, such as getting an object of an ID with: $ ("#idValue").
A jquery object (object) is returned regardless of whether the element of the ID exists or not.
This is completely different from getting DOM objects directly from JavaScript.
In General, $ () gets all the elements that satisfy the condition , that is, this jquery object has a property of length, which represents the number of elements, possibly 0, indicating that no element was fetched. For example, when the target ID to get is not present, the value is 0.
The ID selector is a special selector that only gets a single element that satisfies the specified ID. If the ID has more than one, only the first element is returned.
If the ID does not exist, although you can get the jquery object, but convert the jquery object to a DOM object ( with [0] or get (0)), you will get a undifined.
Any property operations on this DOM object are then given an error because undefined does not have any properties.
// jQueryAlert ($ ("#hello")); // Object // Method1:convert JQuery object to DOM Objectalert ($ ("#hello") [0]); // undefined$ ("#hello") [0].style.color = "Red"; // Report Error here!Since converting to DOM elements is not very useful, then we give up the conversion and manipulate the jquery element directly.
Like what:
$ ("#hello"). CSS ("Color", "red");Thus, although the element of the corresponding ID does not exist , the style modification does not take effect, but the page will not report any errors , because jquery will ignore it.
If the ID exists, the style takes effect.
Most of the methods in the JQuery object support both read and write operations .
Below we give the link plus the ID we want.
<Body> <aID= "Hello">Click Me</a> <Scripttype= "Text/javascript"> //JQueryAlert ($ ("#hello"). length);//Show DOM elements count. $("#hello"). CSS ("Color","Red");//Write ActionAlert ($ ("#hello"). CSS ("Color"));//Read Action </Script></Body>
In this example, Hello is an existing ID that is first given a color value by the write operation of the jquery object's CSS () method, which is then read out by reading the color value, and the pop-up window is displayed.
Most of the methods in jquery use the same name, while supporting the corresponding read and write operations.
The general read operation is a parameter, and the write operation is two parameters.
Summary: jquery syntaxThe jQuery syntax is for the selection of HTML elements, and you can perform certain operations on elements.
The underlying syntax is:$ (selector). Action ()
The $ symbol defines JQuery.
The selector (selector) "Query" and "find" HTML elements.
The action () of JQuery performs a read-write operation on the element.
The contents of the jquery selector are not described in detail here. This article only uses the ID selector as an example.
ReferencesSanthiya Garden Zhang Long teacher javaweb Video tutorial 66.
HTML Reference Manual: Http://www.w3school.com.cn/tags/index.asp
jquery Syntax: http://www.w3school.com.cn/jquery/jquery_syntax.asp
jquery on the characteristics of the selection and manipulation elements of jquery
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
