Home > Article > Web Front-end > What is the difference between JS and JQUERY?
①. Get elements based on ID
{
JS: What you get is a DOM object.
Example: var p = document.getElementByID("one");
JQUERY: What is obtained is a JQUERY object.
Example: var p = $("#one");——The brackets are based on something, which is equivalent to a selection. If we want to find based on the ID, the ID in the style sheet It is represented by #, so here we directly bring in the pound sign. The whole sentence means to search based on the ID of one.
}
②. Get elements according to the class. If you want to get the DOM object in the array, use the index method. If you want to get the JQUERY object, use eq()
{
JS: What is obtained is an array
Example: var p = document.ElementsByClassName("test");
JQUERY:
Example: var p = $(".test");
}
③. Get elements based on name
{
JS: Return an array
Example: var bd = document.getElementsByName(uid);
JQUERY: The method is to use square brackets, attribute = a value, there is no limit to the value must be based on name, JQUERY is based on Attribute to get the element
Example: $("[name='uid']");
}
④. Get the element based on the tag name
{
JS: The return is also an array
Example: var p = document.getElementsByTagName("p");
JQUERY: Add all p in the style sheet The style method is the same, write the tag name directly within double quotes
Example: $("p");
}
Attachment: Other value methods of JQUERY
Combination selection: var p = $("p span");——There are many combinations
************************ ************************************************
Operation content
①. Non-form elements (if it is text, use the text method, if it is html code, use the html method)
{
For example: p.text();——When there are no parameters, it is a value
p.text("aaaa");——When there are parameters, it is an assignment
p.html( );——When there are no parameters, it is a value
p.html("aaaa");——When there are parameters, it is an assignment
}
② .Form element
{
JS:p.value;——Value; p.value = xxx;——Assignment
JUQERY:p.val(); ——Without parameters, it is a value, and with parameters, it is an assignment.
}
**************************************** ******************************
Operation attributes
Used in JS to operate attributes The method is
p.setAttribute("","");——Set attributes and modify attributes
p.removeAttribute("");——Remove attributes and write them in quotation marks An attribute name
p.getAttribute();——Get attributes
Methods used to operate attributes in JQUERY
Add attributes: p.attr("test", "aa");——Add parameters to this attr method, the attribute name is test, and the attribute value is aa
Remove the attribute: p.removeAttr("test");——Remove the test item Attribute
Get the attribute: p.attr("test");——Just write the name of an attribute directly in the attr method
************ *************************************************** ********
Operation style
The keyword for operation style in JS is style
Example: p.style.backgroundColor = "red";— —Set the background color of this p to red
The keyword for operating styles in JQUERY is css
Example: p.css("background-color","yellow");— —Change the background color of this p to yellow. All the styles in the CSS here are exactly the same as the styles in the css style sheet without any changes
The JS method of operating styles can only obtain inline styles, not Take embedded and external! ! ! ! !
JQUERY's method of operating styles can be inline or embedded
The above is the detailed content of What is the difference between JS and JQUERY?. For more information, please follow other related articles on the PHP Chinese website!