JQuery基础

介绍

jQuery库，里面存在大量的JavaScript函数
https://jquery.cuishifeng.cn/

jQuery最重要的操作

公式：$(selector).action()***

引入jQuery

<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">

事件

鼠标事件
mousedown()(jQuery)----按下
mouseenter()(jQuery)
mouseleave()(jQuery)
mousemove()(jQuery)----移动
mouseout()(jQuery)
mouseover()(jQuery)
mouseup()(jQuery)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <title>Document</title>
    <style>
        #divMove{
            width:500px;
            height:500px;
            border:1px solid red;
        }
    </style>
</head>
<body>
    mouse：<span id = "mouseMove"></span>
    <div id = "divMove">
        在这里移动鼠标试试
    </div>
    <script>
        //当网页元素加载完毕之后，响应事件
        //$(document).ready(function(){})
        $(function(){
            $('#divMove').mousemove(function(e){
                $('#mouseMove').text('x:'+e.pageX+"y:"+e.pageY)
            })
        });
    </script>
</body>
</html>
posted @ 2021-11-08 22:42  争取做百分之一  阅读(24)  评论(0)    收藏  举报