jQuery方法

已于 2022-05-18 16:09:41 修改
阅读量67 收藏
点赞数
分类专栏： js 文章标签： jquery javascript 前端
于 2022-03-08 22:43:57 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_63400611/article/details/123363695
版权

jQuery选择器

jQuery基础选择器

名称用法概述
ID选择器$('#id')获取指定ID的元素
全选选择器$('*')匹配所有元素
类选择器$('.class')获取同一类class的元素
标签选择器$('div')获取同一类标签的所有元素
并集选择器$('div,p,li')选取多个元素
交集选择器$('li.current')交集元素
子代选择器$('ul>li')使用>号,获取亲子层级的元素;注意,并不会获取孙子层级的元素
后代选择器$('ul li')使用空格,代表后代选择器,获取ul下的所有li元素,包括孙子等

隐式迭代

隐式迭代就是把匹配的所有元素内部金勋遍历循环,给每个元素添加css方法

代码

<!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">
    <title>Document</title>
</head>

<body>
    <div>同时更换背景色</div>
    <div>同时更换背景色</div>
    <div>同时更换背景色</div>
    <div>同时更换背景色</div>
    <ul>
        <li>相同的操作</li>
        <li>相同的操作</li>
        <li>相同的操作</li>
    </ul>
    <script src="../js/jQuery.js"></script>
    <script>
        //获取四个div元素 将背景色改为粉色
        $('div').css('background', 'pink');

        //隐式迭代就是把匹配的所有元素内部金勋遍历循环 给每个元素添加css方法
        $('ul li').css('color', 'red');
    </script>
</body>

</html>

jQuery筛选选择器

语法用法描述
:first$('li:first')获取第一个li元素
:last$('li:last')

获取最后一个li元素

:eq(index)$('li:eq(2)')获取到的li元素中,选择索引号为2的元素,索引号index从0开始

:odd

$(li:odd')获取到的li元素中,选择索引号为奇数的元素
:even#(li:even')获取到的li元素中,选择索引号为偶数的元素

代码

<!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">
    <title>Document</title>
</head>

<body>
    <ul>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
    </ul>
    <ol>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
    </ol>
</body>
<script src="../js/jQuery.js"></script>
<script>
    $(function() {
        $('ul li:first').css('background', 'pink');
        $('ul li:eq(2)').css('background', 'green');
        $('ol li:odd').css('background', 'yellow');
        $('ol li:even').css('background', 'blue');
    })
</script>

</html>

jQuery筛选方法

语法用法说明
parent()$('li').parent();查找父级
children(selector)$('ul').children('li')相当于$('ul>li'),最近一级(亲子级)
find(selector)$('ul').find('li')相当于$('ul li'),后代选择器
siblings(selector)$('.first').siblings('li')查找兄弟节点,不包括自己本身
nextAll([expr])$('.first').nextAll();查找当前元素之后所有的同辈元素
prevAll([expr])$('.last').prevAll();查找当前元素之前所有的同辈元素
hasClass(class)$('div').hasClass('protected')检查当前的元素是否含有某个特定的类,有则返回true
eq(index)$('li').eq(2);

相当于$('li:eq(2)'),index从0开始

重点:parent() children() find() siblings() eq() 

代码

1.

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

<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">
    <title>Document</title>
</head>

<body>
    <div class="yeye">
        <div class="father">
            <div class="son">儿子</div>
        </div>
    </div>
    <div class="nav">
        <p>p元素</p>
        <div>
            <p>我是p</p>
        </div>
    </div>
    <script src="../js/jQuery.js"></script>
    <script>
        $(function () {
            //父 parent() 返回最近一级的父级元素
            console.log($('.son').parent());

            //子 children() 
            //类似子代选择器 ul>li
            $('.nav').children('p').css('color', 'red');
            //find() 可以选择里面所有的子级 包括儿子和孙子 类似后代选择器
            $('.nav').find('p').css('color', 'red');


        })
    </script>
</body>

</html>

2.

<!DOCTYPE html>
<html lang="zh-CN">
<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">
    <title>Document</title>
</head>
<body>
    <ol>
        <li>ol中的li</li>
        <li>ol中的li</li>
        <li class="item">ol中的li</li>
        <li>ol中的li</li>
        <li>ol中的li</li>
        <li>ol中的li</li>
    </ol>
    <ul>
        <li>ul中的li</li>
        <li>ul中的li</li>
        <li>ul中的li</li>
        <li>ul中的li</li>
        <li>ul中的li</li>
        <li>ul中的li</li>
    </ul>
    <div class="current">这里有current</div>
    <div>这里无current</div>
    <Script src="../js/jQuery.js"></Script>
    <script>
        $(function() {
            //兄弟元素siblings() 除了自身以外的兄弟元素
            $('ol .item').siblings().css('color', 'red');

            //第n个元素 利用选择器方式选择
            var index = 2;
            $('ul li:eq('+ index +')').css('color', 'blue');
            //另一种方式 更推荐下面这种写法
            $('ul li').eq(index).css('color', 'blue');

            //判断是否有某个类名
            console.log($('div:first').hasClass('current'));
            console.log($('div:last').hasClass('current'));
        })
    </script>
</body>
</html>

jQuery排他思想

代码

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

<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">
    <title>Document</title>
</head>

<body>
    <button>点击</button>
    <button>点击</button>
    <button>点击</button>
    <button>点击</button>
    <button>点击</button>
    <button>点击</button>
    <script src="../js/jQuery.js"></script>
    <script>
        $(function() {
            //隐式迭代 给所有的按钮绑定了点击事件
            $('button').click(function() {
                //当前被点击元素背景颜色变化
                $(this).css('background', 'pink');
                //其余的兄弟元素去掉背景颜色(隐式迭代)
                $(this).siblings('button').css('background', '');
            })
        })
    </script>
</body>

</html>

jQuery修改样式css方法

css方法

1.参数只写属性名,则是返回属性值

$(this).css('color');

2.参数是属性名,属性值,逗号分隔,是设置一组样式,属性必须加引号,值不是数字可以不用单位和引号

$(this).css('color', 'red');

 3.参数可以是对象形式,方便设置多组样式,属性名和属性值用冒号隔开,属性可以不用加引号

$('div').css({
    //用逗号隔开 值不是数字要加上引号 复合属性需要使用驼峰命名法
    height: 200,
    backgroundColor: 'blue'
})

设置类样式方法

作用等同于以爱情酿的classList,可以操作类样式,注意操作类里面的参数不要加点

1.添加类 addClass()

$('div').click(function() {
    $(this).addClass('current');
})

2.删除类 removeClass()

$('div').click(function() {
    $(this).removeClass('current');
})

3.切换类 toggleClass()

$('div').click(function() {
    $(this).toggleClass('current');
})

整体代码

<!DOCTYPE html>
<html lang="zh-CN">
<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">
    <title>Document</title>
    <style>
        div {
            width: 100px;
            height: 100px;
            background-color: pink;
            margin: 100px auto;
            transition: all 0.5s;/* 0.5s过渡效果 */
        }
        .current {
            background-color: red;
            transform: rotate(360deg);/* 旋转360° */
        }
    </style>
</head>
<body>
    <div></div>
    <script src="../js/jQuery.js"></script>
    <script>
        $(function() {
            //添加类
            $('div').click(function() {
                // $(this).addClass('current');
            });
            //删除类
            $('div').click(function() {
                // $(this).removeClass('current');
            });
            //切换类
            $('div').click(function() {
                $(this).toggleClass('current');
            })
        })
    </script>
</body>
</html>

类操作与className的区别

原生JS中className全覆盖元素原先里面的类名

jQuery里面类操作知识对指定类进行操作,不影响原先的类名

jQuery效果

常见的动画效果

显示隐藏

  1. show()
  2. hide()
  3. toggle()

滑动效果

  1. slideDown()
  2. slideUp()
  3. slideToggle()

淡入淡出

  1. fadeIn()
  2. dadeOut()
  3. fadeToggle()
  4. fadeTo()

自定义动画

  1. animate()

显示语法规范

show([speed, [easing], [fn]]);

显示参数

  1. 参数都可以省略,无动画直接显示
  2. speed:三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

隐藏语法规范

hide([speed, [easing], [fn]])

隐藏参数 

  1. 参数都可以省略,无动画直接显示
  2. speed:三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

切换语法规范

toggle([speed, [easing], [fn]])

切换参数 

  1. 参数都可以省略,无动画直接显示
  2. speed:三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

下拉切换效果语法规范

slideDown([speed, [easing], [fn]])

下拉切换效果参数 

  1. 参数都可以省略,无动画直接显示
  2. speed:三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

上拉效果语法规范

slideUp([speed, [easing], [fn]])

上拉切换效果参数 

  1. 参数都可以省略,无动画直接显示
  2. speed:三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

滑动切换效果语法规范

slideToggle([speed, [easing], [fn]])

滑动切换效果参数 

  1. 参数都可以省略,无动画直接显示
  2. speed:三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

事件切换

hover([over, ]out)
  1. over:鼠标移到元素上要触发的函数(相当于mouseenter)
  2. out:鼠标移除元素要触发的函数(相当于mouseleave)

代码

<!DOCTYPE html>
<html lang="zh-CN">
<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">
    <title>Document</title>
    <style>
        div {
            width: 100px;
            height: 100px;
            background-color: pink;
            display: none;
        }
        span {
            position: absolute;
            left: 100px;
            height: 50px;
            width: 200px;
            height: 200px;
            background-color: aqua;
            display: none;

        }
    </style>
</head>
<body>
    <button>下拉滑动</button>
    <button>上拉滑动</button>
    <button>切换滑动</button>
    <button>事件切换</button>
    <div></div>
    <span></span>
    <script src="../js/jQuery.js"></script>
    <script>
        $(function() {
            $('button').eq(0).click(function() {
                //下滑动 slideDown()
                $('div').slideDown();
            })
            $('button').eq(1).click(function() {
                //上滑动 slideUp()
                $('div').slideUp();
            })
            $('button').eq(2).click(function() {
                $('div').slideToggle();
            })
            //事件切换 如果只写一个函数 那么鼠标经过和离开都会触发这个函数
            // $('button').eq(3).hover(function() {
            //     $('span').slideDown();
            // }, function() {
            //     $('span').slideUp();
            // })
            //更好的写法
            $('button').eq(3).hover(function() {
                $('span').slideToggle();
            })
        })
    </script>
</body>
</html>

 

jQuery停止动画排队

停止排队

stop()

stop()必须写在动画的前面,写在动画后面会取消动画效果

代码

$('button').eq(3).hover(function() {
                $('span').stop().slideToggle(200);
            })
        })

 

淡入淡出以及突出显示

淡入效果语法规范

fadeIn([speed, [easing], [fn]])

淡入效果参数

  1. 参数都可以省略
  2. speed:三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

淡出效果语法规范

fadeOut([speed, [easing], [fn]])

淡出效果参数

  1. 参数都可以省略
  2. speed:三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

淡入淡出效果语法规范

fadeToggle([speed, [easing], [fn]])

淡入淡出效果参数

  1. 参数都可以省略
  2. speed:三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

渐进方式调整到指定不透明度

fadeTo([speed, opacity, [easing], [fn]])

效果参数

  1. opacity透明度必须写,取值0~1之间
  2. speed:必写参数,三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

案例代码

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

<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">
    <title>Document</title>
    <style>
        img {
            width: 250px;
            height: 250px;
            display: block;
            border: 0;
        }
        ul {
            list-style: none;
        }
        li {
            float: left;
            margin: 0 10px 10px 0;
        }
        .box {
            margin: 100px auto;
            width: 850px;
            height: 530px;
            overflow: hidden;
            background: black;
        }
    </style>
</head>

<body>
    <div class="box">
        <ul>
            <li>
                <a><img src="./image/微信截图_20201201231713.png" alt=""></a>
            </li>
            <li>
                <a><img src="./image/微信截图_20201201231713.png" alt=""></a>
            </li>
            <li>
                <a><img src="./image/微信截图_20201201231713.png" alt=""></a>
            </li>
            <li>
                <a><img src="./image/微信截图_20201201231713.png" alt=""></a>
            </li>
            <li>
                <a><img src="./image/微信截图_20201201231713.png" alt=""></a>
            </li>
            <li>
                <a><img src="./image/微信截图_20201201231713.png" alt=""></a>
            </li>
        </ul>
    </div>
    <script src="../js/jQuery.js"></script>
    <script>
        $(function() {
            //鼠标进入的时候 其他的li标签透明度0.5
            $('.box li').hover(function() {
                $(this).siblings().stop().fadeTo(400, 0.5);
            }, function() {
                $(this).siblings().stop().fadeTo(400, 1);
            })
        })
    </script>
</body>

</html>

 

自定义动画animate

语法

animate(params, [speed], [easing], [fn])

参数

  1. params:想要更改的样式属性,以对象形式传递,必须写.属性名可以不用引号,如果是复合属性则需要采取驼峰命名法,其余参数可以省略
  2. speed:三种预定速度之一的字符串("slow", "nomal", or "fast")或表示动画时长的毫秒数值(如1000)
  3. easing:(Optional)用来指定切换效果,默认为"swing",可用参数"linear"
  4. fn:回调函数,在动画完成时执行的函数,每个元素执行一个

代码

<!DOCTYPE html>
<html lang="zh-CN">
<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">
    <title>Document</title>
    <style>
        div {
            position: absolute;
            left: 0;
            height: 100px;
            width: 100px;
            background-color: pink;
        }
    </style>
</head>
<body>
    <button>点击</button>
    <div></div>
    <script src="../js/jQuery.js"></script>
    <script>
        $(function() {
            $('button').click(function() {
                $('div').animate({
                    left: 400,
                    top: 300,
                    opacity: .4,
                    width: 300
                }, 500)
            })
        })
    </script>
</body>
</html>

 

jQuery属性操作

设置或获取元素固有属性值prop()

元素固有属性就是元素本身自带的属性,比如<a>元素的href

获取属性语法

prop('属性');

设置属性语法

prop('属性', '属性值');

如果使用prop()获取自定义属性会返回undefined

 

设置或获取元素自定义属性值attr()

 获取属性语法

attr('属性');//类似原生getAttribute()

设置属性语法

attr('属性', '属性值');//类似原生setAttribute()

该方法也可以获取H5自定义属性 

代码

<!DOCTYPE html>
<html lang="zh-CN">
<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">
    <title>Document</title>
</head>
<body>
    <a href="http://www.itcast.cn" title="网站">itcast</a>
    <input type="checkbox" checked>
    <div index="1" data-index="2">这里是div</div>
    <script src="../js/jQuery.js"></script>
    <script>
        $(function() {
            //获取元素固有属性
            console.log($('a').prop('href'));
            //设置元素固有属性
            $('a').prop('title', 'www.itcast.cn');
            $('input').change(function() {
                console.log($(this).prop('checked'));
            })
            //自定义属性通过attr()获取
            console.log($('div').attr('index'));
            //设置元素自定义属性值
            $('div').attr('index', 3);
            //获取H5自定义属性
            console.log($('div').attr('data-index'));
        })
    </script>
</body>
</html>

 

数据缓存data()

data()方法可以在指定元素上存取数据,并不会修改DOM元素结构,一旦页面刷新,之前存放的数据都会被移除

代码

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

<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">
    <title>Document</title>
</head>

<body>
    <div data-index="2"></div>
    <span>123</span>
    <script src="../js/jQuery.js"></script>
    <script>
        $(function () {
            //数据缓存data() 这个里面的数据都是存放在元素的内存里面
            $('span').data("uname", "andy");
            console.log($('span').data("uname"));
            //获取H5自定义属性方法 不用写data-开头 且返回数字型
            console.log($('div').data('index'));
        })
    </script>
</body>

</html>

 

jQuery内容文本值

主要针对元素的内容还有表单的值的操作

普通元素内容html()(相当于原生innerHTML)

会显示标签

html()            //获取元素的内容
html("内容")      //设置元素的内容

 

普通元素文本内容text()(相当于原生innerText)

不显示标签

text()            //获取元素的内容
text("内容")      //设置元素的内容

 

表单的值val()(相当于原生value)

val()            //获取表单的内容
val("内容")      //设置表单的内容

 

代码

<!DOCTYPE html>
<html lang="zh-CN">
<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">
    <title>Document</title>
</head>
<body>
    <div>
        <span>内容内容</span>
    </div>
    <input type="text" value="请输入内容">
    <script src="../js/jQuery.js"></script>
    <script>
        //获取设置元素内容 html() 会返回标签
        console.log($('div').html());
        $('div').html('123');

        //获取设置元素文本内容 text() 忽略标签
        console.log($('div').text());
        $('div').text('123');

        //获取设置表单值 va;()
        console.log($('input').val());
        $('input').val('别输入内容');
    </script>
</body>
</html>

 

 

m0_63400611
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jQuery的一些小案例01
enhenglhm的博客
10-06 69
01 导航栏（当鼠标经过导航栏时候就出现菜单选项） 主要是使用了toggleClass添加类名思想（当然，也可以通过 hide 和 show 的使用，也可以通过hover,然后通过slideToggle实现菜单出现）注意：stop()方法结束上一次动画 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-C.
jQuery事件
m0_45659764的博客
05-15 234
目录 1. jQuery事件注册 单个事件注册 语法： 2. jQuery事件处理 2.1 事件处理 on() 绑定事件 语法: on()方法优势1： on()方法优势2： on()方法优势3： 案例：发布微博案例 2.2 事件处理off()解绑事件 2.3 自动触发事件trigger() 3.jQuery事件对象 1. jQuery事件注册 单个事件注册 语法： element.事件(function() {}) $("div").click(fu...
jQuery——类操作、show函数、滑动方法、事件切换、停止排队stop方法及自定义动画方法
追风者
08-03 348
jQuery可以通过.css(“属性名”(，“要修改的值”))操作css样式 括号里可以是键值对的形式，比如： $("div").css({ width:400px, height:200px, backgroundColor:"red"//如果是复合属性则要用驼峰命名法，如果值不是数字，需要加引号 }) 然而在开发中更多使用的是类的操作： 1、添加类 addClass() $("div").addClass("current") 2、删除类 removeC...
jQuery常见方法汇总
林中明月间丶
03-10 2351
语法：父元素jQuery对象.append(新创建的jQuery对象)语法：新创建jQuery对象.appendTo(‘父元素选择器’/父元素jQuery对象)
关于jQuery方法间调用的返回值问题
qq_34774411的博客
09-29 4344
若x方法含有return false，y方法中调用x方法，在调用y方法时并不会像java里一样停止运行，y方法依然会执行下去 若想x方法停止执行时，y方法也停止执行，应先获取x方法的返回值加以判断，根据情况return function x() { return false; } //不会停止 function y() { x(); } //停止 function y() { ...
在jQuery方法中能调用JS方法吗？
厂长的博客
09-05 5429
在jQuery方法中能调用JS方法吗？
在 vue 中使用 jquery 方法
sywdebug的博客
05-31 6444
在 vue.config.js 中配置。使用以下命令安装 jquery。在需要使用的页面中引入即可使用。
jQuery——常用方法
qq_63654439的博客
03-06 2642
$的作用 1、$其实就是一个函数名，是jQuery的所缩写 2、$可以作为选择器，获取DOM对象对应的jQuery对象 3、$可以将一个DOM对象，转换成一个jQuery对象 4、事件中的this，指向DOM对象，所以需要使用$（this）做转换 5、什么时候使用jQuery，什么时候使用 js？其实本质上jQuery就是js，只是我们可以使用一些现成的方法而已 jQuery常用方法 1、index()；获取元素索引 2、text()；获取和设置文本节点 3、css()；获取和设置样式
用jquery方法的字符串截取，jquery字符串截取
热门推荐
qq_45830276的博客
04-22 1万+
用jquery方法的字符串截取，jquery字符串截取
jquery方法
05-06
常用的jquery方法进行了总结，以便于用的时候查找
Jquery方法大全
03-17
Jquery 方法大全
JQuery方法事件大全
10-13
JQuery方法事件大全，JQuery方法事件大全，JQuery方法事件大全，JQuery方法事件大全，JQuery方法事件大全，JQuery方法事件大全，JQuery方法事件大全
vue快速入门（五十）重定向
最新发布
不起眼小菜菜的博客
05-03 326
注释很详细，直接上代码……
Babel 原理浅析
qq_39454432的博客
04-29 811
Babel 原理浅析
三、VUE数据代理
D_A_I_H_A_O的博客
04-29 596
Vue中的数据代理：通过vm对象来代理data对象中属性的操作（读/写）
遍历JavaScript对象（字典）
weixin_45596561的博客
05-01 343
遍历JavaScript对象（字典）是编程中常见的需求。for...in循环提供了最直接的方式，但在某些情况下可能需要额外的检查。与forEach结合使用提供了另一种遍历方式，特别是在您使用现代JavaScript版本时。根据您的具体需求和偏好，可以选择最适合您的遍历方法。
bpmn-js推荐几款常用的插件
飞云先生
04-30 146
bpmn-js整体框架库的风格是以组件的方式进行实现的，这样的结构也更加便于我们更好的对其进行功能扩展，以及客制化功能实现。其实bpmn.io已经为我们实现了较多场景的组件的实现，了解对应组件的功能更能便于我们区分是否需要自己实现，降低重复造轮子的行为，提高开发效率，本篇文章主要是介绍常见的bpmn-js中使用的组件库。
jquery 方法重写
08-23
在jQuery中，你可以通过使用`$.fn.extend`方法来重写已有的jQuery方法。这个方法可以用来扩展或修改jQuery的原型对象。 下面是一个简单的例子，展示如何重写`click`方法： ```javascript // 重写click方法 $.fn....

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值