5、尚硅谷-JavaScript基础-李立超-BOM

最新推荐文章于 2023-05-25 18:25:55 发布
最新推荐文章于 2023-05-25 18:25:55 发布
阅读量650 收藏 6
点赞数
分类专栏： # js入门 前端 文章标签： javascript html5 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/greek7777/article/details/120300436
版权

文章目录

1、何为BOM

  • ECMAScript无疑是JavaScript的核心，但是想要在浏览器中使用JavaScript，那么BOM才是真正的核心（浏览器对象模型）
  • BOM提供了很多对象，用于访问浏览器的功能，这些功能和任何网页内容无关
  • BOM将浏览器中的各个部分转换成一个一个的对象，我们通过修改这些对象属性，调用它们的方法，从而控制浏览器的各种行为

案例说明

<!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>
    <script>
        /**
         * BOM
         * 浏览器对象模型
         * BOM可以使得我们通过js操作浏览器
         * 在BOM中为我们提供了一组对象，用来完成对浏览器的操作
         * BOM对象
         *   Window对象
         *     代表整个浏览器的窗口，同时window也是网页中的全局对象
         *   Navigator对象
         *     代表当前浏览器信息，通过该对象可以用来识别不同的浏览器
         *   Location对象
         *     代表浏览器的地址信息，通过location可以获取地址栏信息，
         *     或者操作浏览器跳转页面
         *   History对象
         *     代表浏览器的历史记录，可以通过该对象来操作浏览器的历史记录
         *     由于隐私原因，该对象不能获取到具体的历史记录，只能操作浏览器向前或者向后，
         *     而且该操作只在该轮访问时有效
         *   Screen对象
         *     代表用户的屏幕信息，通过该对象可以获取用户的显示器的相关信息
         * 这些BOM对象在浏览器中都是作为window对象的属性来保存的，可以通过window对象来使用也可以直接使用
         */
        console.log(navigator);
        console.log(location);
        console.log(history);


    </script>
</head>

<body>

</body>

</html>

样图说明

在这里插入图片描述

2、Navigator对象

2.1、简单介绍

  • 代表的是当前浏览器的信息，通过该对象可以来识别不同的浏览器
  • 由于历史原因，Navigator对象中的大部分属性都已经不能帮助我们识别浏览器了
  • 一般只会使用userAgent来判断浏览器信息的内容，不同的浏览器有不同的userAgent

2.2、案例说明

<!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>02-Navigator</title>
    <script>
        /**
         * Navigator对象
         *   - 代表的是当前浏览器的信息，通过该对象可以来识别不同的浏览器
         *   - 由于历史原因，Navigator对象中的大部分属性都已经不能帮助我们识别浏览器了
         *   - 一般只会使用userAgent来判断浏览器信息的内容
         *     - 不同的浏览器有不同的userAgent
         * 
         * 火狐浏览器userAgent
         * Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:92.0) Gecko/20100101 Firefox/92.0
         * 
         * 谷歌浏览器userAgent
         * Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.159 Safari/537.36
         * 
         * IE8
         * Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)
         * 
         * IE9
         * Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)
         * 
         * IE10
         * Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)
         * 
         * IE11
         * Mozilla/5.0 (Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; rv:11.0) like Gecko
         * 
         * IE11中已经将微软和IE相关的标识都已经去除了，所以我们基本上已经不能通过userAgent来标识一个浏览器了
         */
        var ua = navigator.userAgent;
        if (/firefox/i.test(ua)) {
            alert("你是火狐浏览器");
        } else if (/chrome/i.test(ua)) {
            alert("你是谷歌浏览器");
        } else if (/msie/i.test(ua)) {
            alert("你是IE浏览器");
        } else if ("ActiveXObject" in window) {
            alert("你是IE11浏览器");
        }
    </script>
</head>

<body>

</body>

</html>

2.3、效果图

在这里插入图片描述

3、Location对象

3.1、简单介绍

该对象封装了浏览器的地址栏信息

3.2、案例说明

<!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>04-Location</title>
    <script>
        /**
         * Location
         * 该对象封装了浏览器的地址栏信息
         */
        window.onload = function () {
            // 1、获取btn按钮对象dom
            var btn = document.getElementById("btn");

            // 2、绑定按钮btn响应事件
            btn.onclick = function () {
                // 如果直接打印loaction,可以获取地址栏的信息
                // alert(location); 
                // file:///C:/Users/PMB/Documents/Work%20Files/202109/20210914/04-Location.html

                /**
                 * 分析：
                 *      如果将location属性修改为一个完整的路径或者其他页面，则我们当前页面会自动跳转到该路径
                 *      并且生成响应的历史记录。
                 */
                // location="http://www.baidu.com";

                /**
                 * assign()方法
                 * 用来跳转到其他的页面，作用和直接修改location一样
                 */
                // location.assign("http://www.baidu.com");

                /**
                 * reload()方法
                 * 用于重新加载当前页面，作用和刷新按钮一样
                 * 如果该方法中传递一个true,作为参数，则会强制情况缓存刷新页面
                 * 火狐浏览器，IE浏览器有这种情况然而Chrome浏览器不存在，不需要传参刷新也能清空
                 */
                location.reload();
                /**
                 * replace()
                 * 可以使用一个新的页面替换当前页面，调用完毕会跳转页面
                 * 不会生成历史记录，不能使用回退按钮回退
                 */
                location.replace("01-BOM.html");
            }
        }
    </script>
</head>

<body>
    <button id="btn">点我一下</button>
    <h1>Location</h1>
    <input type="text">
    <a href="01-BOM.html">去BOM</a>
</body>

</html>

3.3、效果图

1、reload
请添加图片描述

2、replace

请添加图片描述

3、assign

请添加图片描述

4、History对象

4.1、简单介绍

  • 该对象可以用来操作浏览器向前或者向后

4.2、案例说明

<!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>03-History</title>
    <script>
        /**
         * History对象
         * 该对象可以用来操作浏览器向前或者向后
         */
        window.onload = function () {
            // 1、获取btn按钮dom
            var btn = document.getElementById("btn");

            // 2、给按钮添加点击绑定事件
            btn.onclick = function () {
                /**
                 * length
                 * 属性，可以获取到当前页面链接数量
                 */
                // alert(history.length); 1

                /**
                 * back()方法
                 * 该方法用来回退到上一个页面，作用和浏览器回退按钮一样
                 */
                // history.back();

                /**
                 * forward()
                 * 可以跳转下一个页面，作用和浏览器前进按钮一样
                 */
                // history.forward();

                /**
                 * go() 方法
                 * 可以用来跳转指定的页面
                 * 它需要一个整数作为参数
                 *   1: 标识向前跳转一个页面，等同于forward()
                 *   2: 标识向前跳转两个页面
                 *  -1: 标识向后跳转一个页面
                 *  -2: 标识向后跳转两个页面
                 */
                history.go(-1);

            }
        }
    </script>
</head>

<body>
    <button id="btn">点我一下</button>
    <h1>History</h1>
    <a href="01-BOM.html">去BOM</a>
</body>

</html>

4.3、效果图

length属性

请添加图片描述

back

请添加图片描述

forward

请添加图片描述

5、定时调用

<!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>05-定时调用</title>
    <script>
        /**
         * 需求：使得count的内容自动切换
         */
        window.onload = function () {
            var count = document.getElementById("count");

            /**
             * js执行顺序非常快
             * 如果希望一段程序，每隔一段事件执行一次，可以使用定时调用
             */
            // for(var i=0;i<10;i++){
            //     count.innerHTML=i;
            //     // alert("hello");
            // }

            /**
             * setInterval()
             * 定时调用
             * 可以将一个函数，每隔一段事件执行一次
             * 参数
             * 1、回调函数，该函数会每隔一段时间被调用一次
             * 2、每次调用间隔的事件单位毫秒
             * 
             * 返回值
             * 返回一个Number类型的数据
             * 这个数字用来作为定时器的唯一标识
             */
            var num = 1;
            var timer = setInterval(function () {
                count.innerHTML = num++;
                if (num === 11) {
                    // 关闭定时器
                    clearInterval(timer);
                }
            }, 1000)
        }
    </script>
</head>

<body>
    <h1 id="count"></h1>
</body>

</html>

请添加图片描述

6、轮播图实现

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
			}
			
			/*
			 * 设置outer的样式
			 */
			#outer{
				/*设置宽和高*/
				width: 520px;
				height: 333px;
				/*居中*/
				margin: 50px auto;
				/*设置背景颜色*/
				background-color: greenyellow;
				/*设置padding*/
				padding: 10px 0;
				/*开启相对定位*/
				position: relative;
				/*裁剪溢出的内容*/
				overflow: hidden;
			}
			
			/*设置imgList*/
			#imgList{
				/*去除项目符号*/
				list-style: none;
				/*设置ul的宽度*/
				/*width: 2600px;*/
				/*开启绝对定位*/
				position: absolute;
				/*设置偏移量*/
				/*
				 * 每向左移动520px，就会显示到下一张图片
				 */
				left: 0px;
			}
			
			/*设置图片中的li*/
			#imgList li{
				/*设置浮动*/
				float: left;
				/*设置左右外边距*/
				margin: 0 10px;
			}
			
			/*设置导航按钮*/
			#navDiv{
				/*开启绝对定位*/
				position: absolute;
				/*设置位置*/
				bottom: 15px;
				/*设置left值
				 	outer宽度  520
				 	navDiv宽度 25*5 = 125
				 		520 - 125 = 395/2 = 197.5
				 * */
				/*left: 197px;*/
			}
			
			#navDiv a{
				/*设置超链接浮动*/
				float: left;
				/*设置超链接的宽和高*/
				width: 15px;
				height: 15px;
				/*设置背景颜色*/
				background-color: red;
				/*设置左右外边距*/
				margin: 0 5px;
				/*设置透明*/
				opacity: 0.5;
				/*兼容IE8透明*/
				filter: alpha(opacity=50);
			}
			
			/*设置鼠标移入的效果*/
			#navDiv a:hover{
				background-color: black;
			}
		</style>
		
		<!--引用工具-->
		<script type="text/javascript" src="js/tools.js"></script>
		<script type="text/javascript">
			window.onload = function(){
				//获取imgList
				var imgList = document.getElementById("imgList");
				//获取页面中所有的img标签
				var imgArr = document.getElementsByTagName("img");
				//设置imgList的宽度
				imgList.style.width = 520*imgArr.length+"px";
				
				/*设置导航按钮居中*/
				//获取navDiv
				var navDiv = document.getElementById("navDiv");
				//获取outer
				var outer = document.getElementById("outer");
				//设置navDiv的left值
				navDiv.style.left = (outer.offsetWidth - navDiv.offsetWidth)/2 + "px";
				
				//默认显示图片的索引
				var index = 0;
				//获取所有的a
				var allA = document.getElementsByTagName("a");
				//设置默认选中的效果
				allA[index].style.backgroundColor = "black";
				
				/*
				 	点击超链接切换到指定的图片
				 		点击第一个超链接，显示第一个图片
				 		点击第二个超链接，显示第二个图片
				 * */
				
				//为所有的超链接都绑定单击响应函数
				for(var i=0; i<allA.length ; i++){
					
					//为每一个超链接都添加一个num属性
					allA[i].num = i;
					
					//为超链接绑定单击响应函数
					allA[i].onclick = function(){
						
						//获取点击超链接的索引,并将其设置为index
						index = this.num;
						
						//切换图片
						/*
						 * 第一张  0 0
						 * 第二张  1 -520
						 * 第三张  2 -1040
						 */
						//imgList.style.left = -520*index + "px";
						//设置选中的a
						setA();
						
						//使用move函数来切换图片
						move(imgList , "left" , -520*index , 20 , function(){
							
						});
						
					};
				}
				
				//创建一个方法用来设置选中的a
				function setA(){
					
					//遍历所有a，并将它们的背景颜色设置为红色
					for(var i=0 ; i<allA.length ; i++){
						allA[i].style.backgroundColor = "";
					}
					
					//将选中的a设置为黑色
					allA[index].style.backgroundColor = "black";
				};
				
				
			};
			
		</script>
	</head>
	<body>
		<!-- 创建一个外部的div，来作为大的容器 -->
		<div id="outer">
			<!-- 创建一个ul，用于放置图片 -->
			<ul id="imgList">
				<li><img src="img/1.jpg"/></li>
				<li><img src="img/2.jpg"/></li>
				<li><img src="img/3.jpg"/></li>
				<li><img src="img/4.jpg"/></li>
				<li><img src="img/5.jpg"/></li>
			</ul>
			<!--创建导航按钮-->
			<div id="navDiv">
				<a href="javascript:;"></a>
				<a href="javascript:;"></a>
				<a href="javascript:;"></a>
				<a href="javascript:;"></a>
				<a href="javascript:;"></a>
			</div>
		</div>
	</body>
</html>

在这里插入图片描述

7、定时器

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			
			*{
				margin: 0;
				padding: 0;
			}
			
			#box1{
				width: 100px;
				height: 100px;
				background-color: red;
				position: absolute;
				left: 0;
			}
			
			#box2{
				width: 100px;
				height: 100px;
				background-color: yellow;
				position: absolute;
				left: 0;
				top: 200px;
			}
			
		</style>
		<script type="text/javascript" src="js/tools.js"></script>
		<script type="text/javascript">
			
			window.onload = function(){
				
				//获取box1
				var box1 = document.getElementById("box1");
				//获取btn01
				var btn01 = document.getElementById("btn01");
				
				//获取btn02
				var btn02 = document.getElementById("btn02");
				
				
				//点击按钮以后，使box1向右移动（left值增大）
				btn01.onclick = function(){
					move(box1 ,"left", 800 , 20);
				};
				
				
				//点击按钮以后，使box1向左移动（left值减小）
				btn02.onclick = function(){
					move(box1 ,"left", 0 , 10);
				};
				
				
				//获取btn03
				var btn03 = document.getElementById("btn03");
				btn03.onclick = function(){
					move(box2 , "left",800 , 10);
				};
				
				//测试按钮
				var btn04 = document.getElementById("btn04");
				btn04.onclick = function(){
					//move(box2 ,"width", 800 , 10);
					//move(box2 ,"top", 800 , 10);
					//move(box2 ,"height", 800 , 10);
					move(box2 , "width" , 800 , 10 , function(){
						move(box2 , "height" , 400 , 10 , function(){
							move(box2 , "top" , 0 , 10 , function(){
								move(box2 , "width" , 100 , 10 , function(){
							
								});
							});
						});
					});
				};
			};
			
			//定义一个变量，用来保存定时器的标识
			/*
			 * 目前我们的定时器的标识由全局变量timer保存，
			 * 	所有的执行正在执行的定时器都在这个变量中保存
			 */
			//var timer;
			
			
			
			
		</script>
	</head>
	<body>
		
		<button id="btn01">点击按钮以后box1向右移动</button>
		<button id="btn02">点击按钮以后box1向左移动</button>
		<button id="btn03">点击按钮以后box2向右移动</button>
		<button id="btn04">测试按钮</button>
		
		<br /><br />
		
		<div id="box1"></div>
		<div id="box2"></div>
		
		<div style="width: 0; height: 1000px; border-left:1px black solid; position: absolute; left: 800px;top:0;"></div>
		
	</body>
</html>

请添加图片描述

geekmice
关注
  • 0
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
尚硅谷李立超老师讲解web前端网课笔记
weixin_62271271的博客
02-10 295
初学web笔记一 HTML的重要知识点： h标签表示一个标题，p标签表示一个段落，hgroup用于标题分组，em标签用于语意加重，blockquote表示长引用，q表示短引用，strong表示强调；
JavaScript李立超基础篇笔记.docx
02-02
总的来说，李立超的JavaScript基础篇教程涵盖了语言的基础知识，包括其历史、特点、基本语法、数据类型、变量和标识符的使用，以及代码编写的位置和方式，是学习JavaScript入门的宝贵资料。通过深入理解和实践这些...
尚硅谷李立超老师讲解web前端---笔记（持续更新）
m0_63695673的博客
03-17 764
商品来自全球数十万品牌商家，囊括家电、手机、电脑、服装、居家、母婴、美妆、个护、食品、生鲜等丰富品类，满足各种购物需求。比较优先级时，需要将所有的选择器的优先级进行相加计算，最后优先级越高，则越优先显示（分组选择器是单独计算的）浏览器开发者模式按f12，elements是元素的意思，点击以后也可以看见我们正在vscode编写的代码。当我们通过不同的选择器，选择相同的元素，并且为相同的样式设置为不同的值时，此时就发生了冲突。默认样式的存在会影响到页面的布局，通常情况下编写网页时必须要去除浏览器的默认样式（
李立超JavaScript基础篇笔记
02-02
针对李立超JavaScript基础篇的教学视频，一集集整理出的笔记，以集数为目录，详细概括了李立超老师所讲的所有内容
前端JavaScript核心基础笔记（李立超老师视频课总结）
m0_73717726的博客
05-25 259
源自于B站up主李立超老师的前端JavaScript基础知识视频课，根据199节视频课的内容，使用Typora笔记软件总结核心知识点，方便前端小白配合老师视频课使用，内含相关概念的定义和配套代码资源，其上传的初衷是为了方便自己学习，养成做笔记的习惯，该资源免费向大家提供，有markdown和pdf，个人推荐markdown配合Typora打开，观看体验会更好，后续会持续更新其它相关前端技术的笔记内容，欢迎大家在评论区发表自己的意见，期待各位的使用，感谢！
尚硅谷（李立超）——HTML5&CSS3笔记总结【持续更新】
01-08
尚硅谷（李立超）——HTML5&CSS3笔记总结【持续更新】 本文适合前端菜鸟食用，小编自己整理的李立超老师视频的笔记，手打不易，那就望您每年快乐吧。逃） 一、进制 1.十进制（日常使用）： 特点：满10进1 计数：0 1 2 3 4 5 6 7 8 9 10 11 12 13 14…19 20 单位数字：10个（0-9） 2.二进制（计算机底层的进制）： 特点：满2进1 计数：0 1 10 11 100 101 110 111 单位数字：2个（0-1） 扩展：所有数据在计算机底层都会以二进制的形式保存。可以将内存想象成一个含有多个小格子的容器，每一个小格子中可以存储一个0或一个1，这一个小格
李立超前端JavaScript基础个人总结笔记
05-25
源自于B站up主李立超老师的前端JavaScript基础知识视频课，根据199节视频课的内容，使用Typora笔记软件总结核心知识点，方便前端小白配合老师视频课使用，内含相关概念的定义和配套代码资源，其上传的初衷是为了方便...
JavaScript基础知识总结.xmind
02-23
通过思维导图的方式，快速了解掌握JavaScript的基本内容
前端面试题大全-李立超老师.zip
10-17
前端面试题大全-李立超老师.zip
经典尚硅谷JavaScript视频
06-15
精心收藏 上百本经典前端电子书 总有基本合适你的 节省大家时间
2018尚硅谷1024全套视频
11-05
2018尚硅谷1024全套视频
34 2 尚硅谷-Mongodb
08-07
教程视频：MongoDB 是一个基于分布式文件存储的数据库
2023.2.8日学习---李立超老师学习笔记
qq_43474780的博客
02-08 345
学习中ing
学习【尚硅谷HTML5前端视频】主讲人李立超（中篇，下篇）
why_su的博客
01-09 4009
视频地址ヾ(✿ﾟ▽ﾟ)ノ 1.电脑中的 1个像素的大小，相当于手机的4个像素的大小。也就是说，电脑中12px的长度，在手机中默认乘以4，为48像素     1em = 1font-size ,  1em 是相对于自身的字体大小来计算的。     颜色  rbg(255,255,255)  rgb(100%,100%,100%) 值在 0-255之间，用十六进制表示：  #红色绿色蓝色   #...
尚硅谷-Python笔记
qq_39662719的博客
01-27 2072
第一章 计算机基础知识（视频1-10） 课程介绍 课程名称：Python基础视频教程 讲师：尚硅谷教育，李立超（lichao.li@foxmail.com） 面向的层次：From Zero to Hero（从入门到精通） 学习方法：认真听讲，多敲代码 必备技能： ① 计算机基本操作 ② 打字的速度 ③ 英语（能阅读基本的英文文档） 计算机是什么 在现实生活中，越来越无法离...
尚硅谷_JavaScript_学习笔记
Jaybo
05-05 4272
JavaScript简介 JavaScript 简介： JavaScript 是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言，是一种动态、弱类型、基于原型的语言，内置支持类。它的解释器被称为 JavaScript引擎，为浏览器的一部份。同时也是一种广泛用于客户端 Web 开发的脚本语言。最初由网景公司（Netscape）的布兰登·艾克（Brendan Eich）设计， 1997 年，在
利用Node.js 超快下载视频
大鱼的博客
12-22 3394
需求是这样的，假如我本地有文件需要传给其他人，比如说用qq，发送过去需要时间，对方下载也需要时间，我利用Node.js的http-server进行传输会特别快，话不多说，直接上过程： （1）安装http-server cnpm install http-server -g （2）启动http-server http-server 目标文件夹 我这里是用的Python的视频 启动后会弹出...
李立超typescript
最新发布
09-20
李立超是一位教授JavaScript和TypeScript的老师。他的教学视频以集数为目录，详细概括了他所讲的所有内容。在他的教学视频中，他讲解了JavaScript和TypeScript的基础知识以及相关的编程技巧和应用场景。 在引用中，...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值