jQuery---jQuery初体验

jQuery初体验

1. 引入jquery文件

2. 入口函数标准

 

jQuery优点总结 (对应的就是js的缺点):

  • 查找元素的方法多种多样,非常灵活
  • 拥有隐式迭代特性,因此不需要手写for循环
  • 完全没有兼容性问题
  • 实现动画非常简单,而且功能更加强大
  • 代码简单粗暴

 

什么是jQuery?

jQuery的官网 http://jquery.com/ jQuery就是一个js库,使用jQuery的话,会比使用JavaScript更简单。

js库:把一些常用到的方法写到一个单独的js文件,使用的时候直接去引用这js文件就可以了。(animate.js、common.js)

我们知道了,jQuery其实就是一个js文件,里面封装了一大堆的方法方便我们的开发,其实就是一个加强版的common.js,因此我们学习jQuery,其实就是学习jQuery这个js文件中封装的一大堆方法。

 

<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    div {
      height: 200px;
      margin-bottom: 10px;
      background-color: #a43035;
      display: none;
    }
  </style>

  <!-- 1.引入jquery文件 -->
  <script src="jquery-1.12.4.js"></script>
  <script>
    //2. 入口函数的标准
    $(document).ready(function () {
      //获取对象,注册事件,把on去掉,是一个方法
      $("#btn1").click(function () {
        //隐式迭代:偷偷的遍历,jQuery会自动的遍历,不需要我们遍历。
        $("div").show(1000);
      });
      $("#btn2").click(function () {
        $("div").text("我是内容");
      });
    });
  </script>

</head>

<body>

  <input type="button" value="btn1" id="btn1">
  <input type="button" value="设置内容" id="btn2">

  <div></div>
  <div></div>
  <div></div>


</body>

</html>
posted @ 2020-01-15 10:32  jane_panyiyun  阅读(186)  评论(0编辑  收藏  举报