jQuery

已于 2022-01-18 21:26:24 修改
阅读量152 收藏
点赞数
文章标签： jquery
于 2022-01-11 22:02:17 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_53059814/article/details/122442452
版权

学JQuery,这一篇就够了

一.简介

jQuery 库可以通过一行简单的标记被添加到网页中。

jQuery 是一个 JavaScript 函数库。

jQuery 是一个轻量级的"写的少，做的多"的 JavaScript 库。

整体就是替换繁琐的JavaScript语法,让语法更简单了

二.语法

使用之前需要引用对应的jQuery

 <!-- 引入jQuery -->
 <script src="./jquery-3.6.0.min.js"></script>

通过 jQuery，您可以选取（查询，query） HTML 元素，并对它们执行"操作"（actions）。

语法

 $(selector(查询,查找)).action(操作)

案例hide()

 <img src="./image/Beauty.jpg" alt="" width="500px" id="img">
 $('#img').hide();
 // 隐藏当前id为img的标签

这里会出现一个问题,例如如果将script放到html前面,那么jQuery失效,原因跟HTML执行顺序有关,所以解决方案如下

 
$('document').ready(function(){
     //执行代码
 })
$(function(){
     //执行代码
 })

js解决方案

 
window.onload =function(){
     //执行代码
 }

三.选择器

jQuery对比着CSS的选择器学习效果更佳

3.1 元素选择器

jQuery 元素选择器基于元素名选取元素。

语法: $(元素名)

案例:用户点击元素消失

 $(document).ready(function(){
     //获取按钮,注册点击事件
     $('button').click(function(){
         //获取文字
         $('p').hide();
     })
 })
 
<p id="p_id" class="p_class">我欲乘风破浪,踏遍黄沙海洋</p>
 <button>取消</button>

3.2 ID选择器

jQuery #id 选择器通过 HTML 元素的 id 属性选取指定的元素。

页面中元素的 id 应该是唯一的，所以您要在页面中选取唯一的元素需要通过 #id 选择器。

语法: $('#id')

$(document).ready(function(){
    //获取按钮,注册点击事件
    $('#button_id').click(function(){
        //获取文字
        $('#p_id').hide();
    })
})

3.3 class选择器

jQuery 类选择器可以通过指定的 class 查找元素。

语法: $('.class')

$(document).ready(function(){
    //获取按钮,注册点击事件
    $('.button_class').click(function(){
        //获取文字
        $('.p_class').hide();
    })
})
// 如果遇到多个class选择器,就配合伪类命中
$(document).ready(function(){
   let text =  $('.two:first').text();
    alert(text)
})

3.4 统配选择器

获取页面所有内容

语法: $("*")

$(document).ready(function(){
     //获取按钮,注册点击事件
     $('button').click(function(){
         //获取所有内容
         $('*').hide();
     })
})

3.5 当前元素

获取当前HTML元素

语法: $(this)

$(document).ready(function(){
     //获取按钮,注册点击事件
     $('button').click(function(){
         //获取所有内容
         $(this).hide();
     })
})

3.6 组合使用

获取选择器进行筛选

语法: $("p.intro") 获取所有class选择器为intro的p标签

$(document).ready(function(){
     //获取按钮,注册点击事件
     $('button').click(function(){
         //获取所有内容
         $('p.p_class').hide();
     })
})

3.6 伪类选择器

在CSS中提供的伪类选择器同样适用

例: 语法 $(ul li:first)

$(document).ready(function () {
    $('button').click(function () {
        //获取ul下面的第一个li 并且删除
        $('ul li:first').hide();
       + $('ul>li:first-child').hide();
    })
})

选取带有 href 属性的元素

语法: $("[href]")

$(document).ready(function () {
    $('button').click(function () {
        // 获取所有带herf属性并且删除
        $('[href]').hide();
    })
})

选取所有 target 属性值等于 "_blank" 的<a> 元素

语法: $("a[target='_blank']")

$(document).ready(function () {
    $('button').click(function () {
        // 获取所有带herf属性并且删除
        $('a[target=_blank]').hide();
       + $('a[target!=_blank]').hide(); 
        // 不等于同理
    })
})

选取所有 type="button"的 <input> 元素 和 <button>元素

语法:$(":button")

$(document).ready(function () {
    $('button').click(function () {
        //获取type为button的按钮或者button按钮,并且消失
        $(':button').hide();
    })
})

选取偶数位置的<tr>元素

语法:$("tr:even")

选取奇数位置的<tr>元素

语法:$("tr:odd")

$(document).ready(function () {
    $('button').click(function () {
        //获取tr的偶数并且消失
        $("tr:even").hide();
        //获取tr的奇数并且消失
      +  $("tr:odd").hide();
    })
})
    <table>
        <tr class="tr_class">
            <td>张飞1</td>
        </tr>
        <tr class="tr_class">
            <td>张飞2</td>
        </tr>
        <tr class="tr_class">
            <td>张飞3</td>
        </tr>
        <tr class="tr_class">
            <td>张飞4</td>
        </tr>
    </table>

四. jQuery事件

事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。

4.1 常见事件

鼠标事件键盘事件表单事件窗口事件
click(点击事件)keypresssubmitload
dblclick(双击事件)keydownchangeresize
mouseenter(鼠标进入,聚焦)focusscroll
mouseleave(鼠标离开)blurunload

Ⅰ click点击事件

click() 方法是当按钮点击事件被触发时会调用一个函数。

$(document).ready(function () {
    //获取p标签,当点击就取消
    $('.p_class').click(function () {
        $(this).hide();
    })
})

Ⅱ dblclick 双击事件

当双击元素时，会发生 dblclick 事件。

$(document).ready(function () {
    //获取p标签,当双击就取消
    $('.p_class').dblclick(function () {
       $(this).hide();
    })
})

Ⅲ mouseenter移动事件

当鼠标指针穿过元素时，会发生 mouseenter 事件。

$(document).ready(function () {
    //获取当前p标签,当悬停上面就弹出,你是我的小可爱
    $('.p_class').mouseenter(function () {
        alert('你是我的小可爱')
    })
})

Ⅳ mouseleave离开元素

当鼠标指针离开元素时，会发生 mouseleave 事件。

$(document).ready(function () {
    //获取当前p标签,当悬停上面就弹出,拜拜
    $('.p_class').mouseleave(function () {
        alert('拜拜')
    })
})

Ⅴ mousedown()

当鼠标指针移动到元素上方，并按下鼠标按键时，会发生 mousedown 事件。

$(document).ready(function () {
    //获取当前p标签,当悬停上面就弹出,你是我的小可爱
    $('.p_class').mousedown(function () {
        alert('上面按下鼠标了')
    })
})

Ⅵ mouseup()

当在元素上松开鼠标按钮时，会发生 mouseup事件。

$(document).ready(function () {
    //获取当前p标签,当悬停上面就弹出,你是我的小可爱
    $('.p_class').mouseup(function () {
        alert('上面松开了鼠标了')
    })
})

Ⅶ focus()

当元素获得焦点时，发生 focus 事件。

$(document).ready(function () {
    //获取当前input标签,当聚焦上面改变背景颜色
    $('#input').focus(function () {
        $(this).css('background-color','red')
    })
})

Ⅷ blur()

当元素失去焦点时，发生 blur 事件。

$(document).ready(function () {
    //获取当前input标签,当失去聚焦改变背景颜色
    $('#input').blur(function () {
       $(this).css('background-color','#fff')
    })
     //获取当前input标签,当聚焦上面改变背景颜色
    $('#input').focus(function () {
        $(this).css('background-color','red')
     })
})

五.常见函数效果

5.1 显示隐藏

Ⅰ. hide()和show()

JQuert 的 hide()和show()

$(document).ready(function () {
   //点击隐藏效果
   $('#button_id').click(function(){
       $('#p_id').hide();
   })
   //点击显示效果 
   $('#show_id').click(function(){
    $('#p_id').show();
   })
})

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是隐藏或显示完成后所执行的函数名称。

$(document).ready(function () {
   //点击隐藏效果
   $('#button_id').click(function(){
       $('#p_id').hide(1000,'linear');
      + $('#p_id').hide('slow','linear');
   })
   //点击显示效果
   $('#show_id').click(function(){
    $('#p_id').hide('fast','linear');
   + $('#p_id').show(1000,'linear',function(){
        alert('显示完毕!')
    });
   })
})

Ⅱ. toggle()

通过 jQuery，您可以使用 toggle() 方法来切换 hide()和show()方法。

$(document).ready(function () {
    $('#button_id').click(function(){
        //获取p标签 显示隐藏
        $('#p_id').toggle();
    })
})

5.2 淡入淡出

Ⅰ. fadeOut()

jQuery fadeOut() 方法用于淡出可见元素。

语法:$(*selector*).fadeOut(*speed,callback*);

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是 fading 完成后所执行的函数名称。

$(document).ready(function () {
    $('.one').click(function () {
        $('.two').fadeOut(1000, 'linear');
    })
})

Ⅱ. fadeToggle()

jQuery fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。

如果元素已淡出，则 fadeToggle() 会向元素添加淡入效果。

如果元素已淡入，则 fadeToggle() 会向元素添加淡出效果。

$(document).ready(function () {
    $('.one').click(function () {
        $('.two').fadeToggle(1000, 'linear');
    })
})

5.3 滑动效果

jQuery 滑动方法可使元素上下滑动。

Ⅰ.slideDown()

jQuery slideDown() 方法用于向下滑动元素。

语法:

$(selector).slideDown(speed,callback);

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是滑动完成后所执行的函数名称。

$(document).ready(function () {
    $('.one').click(function () {
        $('.two').slideDown();
    })
})

Ⅱ. slideUp()

jQuery slideUp() 方法用于向上滑动元素。

$(document).ready(function () {
    $('.one').click(function () {
        $('.two').slideUp();
    })
})

5.4 动画

jQuery animate() 方法用于创建自定义动画。

语法: $(selector).animate({params},speed,callback*);

必需的 params 参数定义形成动画的 CSS 属性。

$(document).ready(function () {
    $('.box').click(function () {
        // 向右移动250px
        $(this).animate({left:'250px'});
    })
})
$(document).ready(function () {
    $('.box').click(function () {
        // 向右移动250px,颜色变红,字体变大,如果遇到横杠就改成驼峰命名
        $(this).animate({
            left:'250px',
            color:'red',
            fontSize:'30px',
            // 在原来的基础上加150px
            width:'+=300px'
        });
    })
})

六.操作DOM节点

6.1 获得内容

Ⅰ.获得文本内容

text() - 设置或返回所选元素的文本内容

$(document).ready(function(){
   console.log($('.two').text());
})

Ⅱ,获得网页元素

html() - 设置或返回所选元素的内容（包括 HTML 标记）

$(document).ready(function(){
   console.log($('.two').html());
})

Ⅲ. 返回表单字段的值

val() - 设置或返回表单字段的值

<input type="text" value="password" id="input">
$(document).ready(function(){
    console.log($('#input').val());
})
//---> password

Ⅳ.获取属性的值

attr() 方法用于获取属性值。

<input type="password" value="password" id="input">
$(document).ready(function(){
    console.log($('#input').attr('type'));
})

6.2 修改内容

Ⅰ. 修改文本内容

$(document).ready(function(){
   console.log($('.two').text('hello world!'));
})

Ⅱ. 修改html元素

$(document).ready(function(){
   console.log($('.two').html('<h3>hello world!</h3>'));
})

Ⅲ. 修改val值

$(document).ready(function(){
    console.log($('#input').val('type'));
})

6.3.添加元素

Ⅰ. append()

jQuery append() 方法在被选元素的结尾插入内容（仍然在该元素的内部）。

$(document).ready(function(){
   console.log($('.two').after('hello world!'));
})

Ⅱ. prepend()

jQuery prepend() 方法在被选元素的开头插入内容。

$(document).ready(function(){
   console.log($('.two').prepend('hello world!'));
})

Ⅲ. after()

jQuery after() 方法在被选元素之后插入内容. 在元素外部

$(document).ready(function(){
   console.log($('.two').after('hello world!'));
})

Ⅳ. before()

jQuery before() 方法在被选元素之前插入内容. 在元素外部

$(document).ready(function(){
   console.log($('.two').before('hello world!'));
})

6.4 删除元素

remove() - 删除被选元素（及其子元素）

empty() - 从被选元素中删除子元素

Ⅰ. remove()

jQuery remove() 方法删除被选元素及其子元素。

$(document).ready(function () {
    $('.two').remove();
})

Ⅱ. empty()

empty() - 从被选元素中删除子元素

$(document).ready(function () {
    $('.two').empty();
})

6.5 获取并设置CSS类

Ⅰ. addClass()

addClass() - 向被选元素添加一个或多个类

.theme{
    font-size: 30px;
    color: blue;
}
$(document).ready(function () {
    $('.two').addClass('theme')
})

Ⅱ. removeClass()

removeClass() -从被选元素删除一个或多个类

$(document).ready(function () {
    $('.two').removeClass('two')
})

Ⅲ. toggleClass()

toggleClass() - 对被选元素进行添加/删除类的切换操作

$(document).ready(function () {
    $('.two').click(function(){
        $(this).toggleClass('theme')
    })
})

6.6 设置CSS属性

css() 方法设置或返回被选元素的一个或多个样式属性。

$(document).ready(function () {
    $('.two').click(function(){
        $(this).css('color','blue')
    })
})

操作多个属性时候用花括号包起来

$(document).ready(function () {
    $('.two').click(function(){
        $(this).css({'color':'blue','font-size':'50px'})
    })
})

七.遍历DOM节点

7.1 祖先元素

Ⅰ.parent()

parent() 方法返回被选元素的直接父元素。

$(document).ready(function () {
    console.log($('.ul').parent().text());
})

Ⅱ. parents()

parents() 方法返回被选元素的所有祖先元素，它一路向上直到文档的根元素 (<html>)。

$(document).ready(function () {
    console.log($('.ul').parents().text());
})

Ⅲ. parentsUntil()

parentsUntil() 方法返回介于两个给定元素之间的所有祖先元素。

$(document).ready(function () {
    console.log($('.ul').parentsUntil('.box'));
})

7.2 后代元素

Ⅰ. children()

children() 方法返回被选元素的所有直接子元素。 (一层)

$(document).ready(function () {
    console.log($('.box').children());
})

可以使用可选参数来过滤对子元素的搜索

$(document).ready(function () {
    // 命中.box 下面的 .one
    console.log($('.box').children('.one'));
})

Ⅱ. find()

find() 方法返回被选元素的后代元素，一路向下直到最后一个后代。

$(document).ready(function () {
    console.log($('.box').find('*'));
})

7.3 兄弟元素

Ⅰ.siblings()

siblings() 方法返回被选元素的所有同胞元素。

$(document).ready(function () {
    console.log($('li').siblings());
})

Ⅱ.next()

next() 方法返回被选元素的下一个同胞元素

$(document).ready(function () {
    console.log($('.li').next().text());
})

Ⅲ. nextAll()

nextAll() 方法返回被选元素的所有跟随的同胞元素。

$(document).ready(function () {
    console.log($('.li').nextAll().text());
})

Ⅳ. nextUntil()

nextUntil() 方法返回介于两个给定参数之间的所有跟随的同胞元素。

$(document).ready(function () {
    console.log($('.li').nextUntil('.last-li').text());
})

Ⅴ. prev()

siblings() 方法返回被选元素的前面同胞元素。

$(document).ready(function () {
    console.log($('.li').prev().text());
})

Ⅵ. prevAll()

nextAll() 方法返回被选元素的前面所有的同胞元素。

$(document).ready(function () {
    console.log($('.li').prevAll().text());
})

Ⅶ. prevUntil()

nextUntil() 方法返回介于两个给定参数之间的所有前面的同胞元素。

$(document).ready(function () {
    console.log($('.li').prevUntil('.first-li').text());
})

3.4 过滤

缩小搜索元素的范围

Ⅰ. first()

first() 方法返回被选元素的首个元素。

$(document).ready(function () {
    console.log($('.li').prev().first().text());
})

Ⅱ. last()

last() 方法返回被选元素的最后一个元素。

$(document).ready(function () {
    console.log($('.li').prev().last().text());
})

Ⅲ.eq()

eq() 方法返回被选元素中带有指定索引号的元素。

$(document).ready(function () {
    console.log($('.ul li').prev().eq(1).text());
})

八.AJAX

8.1 概念

AJAX = 异步 JavaScript 和 XML（Asynchronous JavaScript and XML）。

简短地说，在不重载整个网页的情况下，AJAX 通过后台加载数据，并在网页上进行显示。

8.2 语法

$(selector).load(URL,data,callback);

必需的 URL 参数规定您希望加载的 URL。

可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。

可选的 callback 参数是 load() 方法完成后所执行的函数名称。

8.3 相关参数

  $(document).ready(function () {
    $.ajax({
        url: '请求的地址',
        type: '规定请求的类型/GET/POST',
        async:'是否同步',
        contentType:'发送数据到服务器所用的内容类型,默认是:application/x-www-form-urlencoded',
        data:'规定要发送到服务器的数据',
        dataType:'预期的服务器响应的数据类型(希望服务器返回的类型)',
        sussess:function(result){
            '成功时候执行的函数'
            result: 成功返回的结果
        },
        error:function(){
            '失败时候执行的函数'
        }
    }
 )
})

地雷Java
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
jQuery 替换 class 的方法
weixin_45438997的博客
07-27 3915
1、 // 添加新的样式，移除旧的样式 .addClass("new-class") .removeClass("old-class"); 2、 // 修改class属性，直接替换原class .attr("class","new-class"); 3、 // 自动检测，有就移除，没有就添加 .toggleClass("class1"); ...
Java Web Jquery表单验证
07-26
编写基于Jquery的表单验证插件 Java Web Jquery表单验证 jQuery是一个流行的JavaScript库，可用于在网页上进行各种操作，包括表单验证。 1、将基于Jquery的表单验证的调查问卷分为四个部分：FrontPage.html、write....
jQuery prev（）示例
一名可爱的技术搬运工
05-23 826
prev（）函数用于获取匹配元素集中的前一个同级元素。 仅选择前一个同级的元素，其子元素将被忽略。 此prev（）函数允许通过“选择器”对其进行过滤。 例如，prev（'div'）用于获取前一个仅是<div>元素的同级元素。 jQuery prev（）示例 <html> <head> <style type="text/css"> ...
jq修改class_JQuery中怎么设置class
weixin_28396629的博客
02-06 6799
JQuery中设置class相关的有如下三个方法：$(selector).addClass();//向被选元素添加一个或多个类$(selector).removeClass();//从被选元素删除一个或多个类$(selector).toggleClass();//对被选元素进行添加/删除类的切换操作下面实例演示一下以上三个方法的用法：创建Html元素点击不同按钮...
Jquery中next()方法与prev()方法的使有和详解
WilsonMP
08-24 8505
在jQuery中，我们可以选择某个DOM元素进行获取和操作，但是有时候我们在操作某个元素的时候，也要对它相邻的的元素进行获取或是操作，那我们该如何去做呢，今天记录一个获取某个元素的相邻的上一个元素或相邻的下一个元素。 jQuery中的next()方法 next()方法，获取指定元素同辈的下一个元素 语法 $().next() jQuery中的prev()方法 prev方法：获取指定...
jQuery - 3.6.0
05-04
jQuery 是一个快速、小巧且功能丰富的 JavaScript 库。它使HTML文档遍历和操作，事件处理，动画和Ajax等功能变得更加简单，它具有易于使用的API，可跨多种浏览器运行。凭借多功能性和可扩展性的结合，jQuery改变了数...
jquery-3.7.0.min.js（jQuery下载）
06-25
jquery-3.7.0.min.js（jQuery下载）jquery-3.7.0.min.js（jQuery下载）jquery-3.7.0.min.js（jQuery下载）jquery-3.7.0.min.js（jQuery下载）jquery-3.7.0.min.js（jQuery下载）jquery-3.7.0.min.js（jQuery下载）...
jquery-3.3.1.js和jquery-3.3.1.min.js
03-22
jquery-3.3.1.js和jquery-3.3.1.min.js免费下载哈。jquery-3.3.1.js和jquery-3.3.1.min.js免费下载哈。jquery-3.3.1.js和jquery-3.3.1.min.js免费下载哈。jquery-3.3.1.js和jquery-3.3.1.min.js免费下载哈。jquery-...
jquery-migrate
03-05
jQuery 迁移插件， Migrate 有两个版本。jquery-migrate-1.4.1版本将帮助您将 1.9 之前的 jQuery 代码更新到 jQuery 1.9 到 3.0。 jquery-migrate-3.4.0版本将帮助您更新代码以在 jQuery 3.0 或更高版本上运行。 ...
jquery-1.9.1.js
最新发布
09-07
jquery-1.9.1版本
前端+jQuery+实现烟花特效
05-02
前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+...
jQuery源码 jQuery源码 jQuery源码
04-19
jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码jQuery源码...
jquery验证码
10-19
jQuery实现web开发验证码，无需后台验证。简单方便实用
jquery-3.6.0
09-06
jquery-3.6.0
jQuery修改class属性
热门推荐
qq_34589867的博客
08-25 5万+
1.addClass() addClass()方法向匹配的元素增加指定的类名(一个或多个) 注意:对于元素来说,class属性可以有多个值.该方法不会移除已经存在的值,而是在原有的基础上追加一个或多个class属性. 2.removeClass(); 移除样式 3.hasClass() 包含某个样式 4.$(“#xxx”).attr(“class...
jq里的find,next,prev之间的区别
lmp5023的博客
03-10 672
find()是用来查找后代元素，next()是用来查找同级元素的。 find()可以查找后代任意一个元素，但需要进行匹配。 next()只能查找后一个同级元素，如果想查找下下个元素，就多用一个next() prev和next相对 ...
JQuery：overflow、 <dl> 、data()、 siblings() 、prev()
QLiuQ
06-14 1371
记录项目中碰到的几个前端方法，属性。overflow：visible默认值。内容不会被修剪，会呈现在元素框之外。hidden内容会被修剪，并且其余内容是不可见的。scroll内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。auto如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。inherit规定应该从父元素继承 overflow 属性的值。&lt;dl&gt;:&lt;dl&gt;...
jQuery12(prev练习,相对元素)
xbc1213的博客
02-06 384
prev练习题目:评分 实例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>
jQuery用addClass方法同时增加多个class属性
专注it
12-28 1万+
一句话代码：

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值