Home >Web Front-end >JS Tutorial >Why use jquery
Why use jquery
- coldplay.xixiOriginal
- 2020-11-16 10:53:133387browse
Reasons for using jquery: 1. You can quickly obtain DOM elements based on CSS selectors; 2. In addition, when modifying the CSS style of DOM elements, the programming format is similar to the style tag, making it easy to remember.
Recommended: "jquery video tutorial"
1. What is jQuery
jQuery is a set of JavaScript libraries that simplify some of the complexities of using JavaScript to develop web page special effects, providing automation of common tasks and simplification of complex tasks. Using jQuery can not only reduce functions that originally require a lot of JavaScript code to a few lines of code, but also provide sufficiently high-speed performance.
2. Why use jQuery
As an example, suppose we now have the following basic web page:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
*{
margin: 0;
padding: 0;
}
div{
width: 100px;
height: 100px;
border: 1px solid #000000;
}
</style>
</head>
<body>
<div></div>
<div></div>
<div id="box2"></div>
</body>
</html>Then we use native JavaScript, jQuery to change the background color of the three divs above.
<script>
//使用原生JavaScript改变背景颜色
window.onload = function (ev) {
var div1 = document.getElementsByTagName("div")[0];
var div2 = document.getElementsByClassName("box1")[0];
var div3 = document.getElementById("box2");
// console.log(div1);
// console.log(div2);
// console.log(div3);
div1.style.backgroundColor = "red";
div2.style.backgroundColor = "yellow";
div3.style.backgroundColor = "blue";
}
//使用jQuery改变背景颜色
// $(function () {
// var $div1 = $("div")[0];
// var $div2 = $(".box1")[0];
// var $div3 = $("#box2")[0];
// // console.log($div1);
// // console.log($div2);
// // console.log($div3);
// $div1.css({
// background: "red"
// });
// $div2.css({
// background: "yellow"
// });
// $div3.css({
// background: "blue"
// });
// })
</script>Comparing the two methods, we can see that the most direct benefit of using jQuery is that you can quickly obtain DOM elements based on CSS selectors. In addition, when modifying the CSS style of DOM elements, the programming format is similar to the style tag, making it easy to remember. Of course, there are other benefits to using jQuery, which we will continue to discover in later studies.
Related free learning recommendations: JavaScript (video)
The above is the detailed content of Why use jquery. For more information, please follow other related articles on the PHP Chinese website!