jqure应用汇总

最新推荐文章于 2023-05-14 10:30:40 发布

甲戌天火

最新推荐文章于 2023-05-14 10:30:40 发布

阅读量710

点赞数

分类专栏： HTML5

本文链接：https://blog.csdn.net/qq_36872096/article/details/76095199

版权

html>lang="en"> charset="UTF-8"> jquery的基本应用 src="../../js/jquery-3.1.1.min.js" >导入jquery文件--> type="text/javascript"> /* $(document).ready(function(){//文档就绪函数。 $('p

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>jquery的基本应用</title>
    <script src="../../js/jquery-3.1.1.min.js" ></script><!--导入jquery文件-->
    <script type="text/javascript">
        /* $(document).ready(function(){//文档就绪函数。
         $('p').hide();//隐藏元素
         });//script若是放在上面，需要加上文档就绪函数，放在下面没必要
         */
        //简化版的文档就绪函数
        $(function(){
            $('p').hide();
        })
    </script>


</head>
<body>
<p>说好的不拖堂呢</p>
<p>说好的不拖堂呢</p>
<p>说好的不拖堂呢</p>
</body>
<!--
<script type="text/javascript">
    $('p').hide();//隐藏元素
</script>-->
</html>


<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>通过修改样式来实现鼠标移动的效果</title>
    <script type="text/javascript" src="../../js/jquery-3.1.1.min.js"></script>
    <style>
        img{
            margin: 10px 10px;
            border: 3px solid olivedrab;
        }
    </style>
</head>
<body>
<img src="../../image/new_01.jpg" alt=""/>
<img src="../../image/new_02.jpg" alt=""/>
<img src="../../image/new_03.jpg" alt=""/>
</body>
<script type="text/javascript">
    //选择元素，添加事件
    $('img').mouseover(function(){
        //css中两个元素，一个是要修改的元素名称，第二个是元素的值。
        $(this).css('border','6px solid orange');
    }).mouseout(function(){
        $(this).css('border',' 3px solid olivedrab');
    })
</script>
</html>


<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>通过修改类名实现鼠标移动的效果</title>
    <script type="text/javascript" src="../../js/jquery-3.1.1.min.js"></script>
    <style>
        img{
            margin: 10px 10px;
            border: 3px solid olivedrab;
        }
        .a{

            border:

最低0.47元/天解锁文章

甲戌天火

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
jqure应用汇总

html>lang="en"> charset="UTF-8"> jquery的基本应用 src="../../js/jquery-3.1.1.min.js" >导入jquery文件--> type="text/javascript"> /* $(document).ready(function(){//文档就绪函数。 $('p
复制链接

扫一扫