评论

收藏

[jQuery] 快速入门

开发技术 开发技术 发布于:2021-08-03 12:28 | 阅读数:377 | 评论:0

01-快速入门-jQuery的介绍

  • jQuery 是一个 JavaScript 库。
  • 所谓的库,就是一个 JS 文件,里面封装了很多预定义的函数,比如获取元素,执行隐藏、移动等,目的就 是在使用时直接调用,不需要再重复定义,这样就可以极大地简化了 JavaScript 编程。
  • jQuery 官网:https://www.jquery.com

02-快速入门-jQuery的快速入门

  • 开发思路

  • 编写 HTML 文档。
  • 引入 jQuery 文件。
  • 使用 jQuery 获取元素。
  • 使用浏览器测试。


  • 代码实现
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>快速入门</title>
</head>
<body>
  <div id="div">我是div</div>
</body>
<!--引入 jQuery 文件-->
<script src="js/jquery-3.3.1.min.js"></script>
<script>
  // JS方式,通过id属性值来获取div元素
  let jsDiv = document.getElementById("div");
  //alert(jsDiv);
  //alert(jsDiv.innerHTML);
  // jQuery方式,通过id属性值来获取div元素
  let jqDiv = $("#div");
  alert(jqDiv);
  alert(jqDiv.html());
</script>
</html>
03-快速入门-快速入门的小结

  • jQuery 是一个 JavaScript 库。
  • 说白了就是定义好的一个 JS 文件,内部封装了很多功能,可以大大简化我们的 JS 操作步骤。
  • jQuery 官网:https://www.jquery.com。
  • 要想使用,必须要引入该文件。
  • jQuery 的核心语法 $();




关注下面的标签,发现更多相似文章