js基础6 Navigator/history/location/定时器简介/定时器贪吃蛇/切换图片/移动函数/tool.js轮播图

木一叶liuyue

已于 2022-04-02 16:46:04 修改

阅读量500

点赞数

分类专栏：前段文章标签： js css 媒体

于 2022-03-27 17:21:10 首次发布

本文链接：https://blog.csdn.net/Kerryliuyue/article/details/123776878

版权

前段专栏收录该内容

47 篇文章 0 订阅

订阅专栏

Navigator

请添加图片描述

<!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>navigator</title>

    <script type="text/javascript">
        window.onload = function () {
            /*dom是操作网页
            
            BOM 浏览器对象模型，通过js操作浏览器
            在BOM中提供了一组对象，用来完成对浏览器的操作
                Window  代表的是整个浏览器的窗口，是网页中的全局对象 
                Navigator 代表当前浏览器的信息，识别不同的浏览器
                Location  代表浏览器的地址栏信息，或者操作浏览器跳转页面
                History 代表浏览器的历史记录，通过该对象操作浏览器的历史记录
                        由于隐私，该对象不能获取具体的历史记录
                        只能操作浏览器向前或者向后翻页，该操作只在当次访问有效
                Screen  代表浏览器的屏幕信息，通过该对象获取到浏览器用户的显示器的相关信息

            这些BOM对象在浏览器都是作为window对象的属性保存的
            可以通过window对象使用，也可以直接使用

            */
            //    console.log(window.navigator);
            /*  
            console.log(navigator.appName);
            得到 Netscape 
            navigate对象中大部分属性已经不能识别浏览器了
   
   
            */
            var ua = navigator.userAgent;
            console.log(ua);
            /* //中代表含有 i表示忽略大小写 */
            if (/firefox/i.test(ua)) {
                alert("你是火狐！！！");

            } else if (/chrome/i.test(ua)) {
                alert("你是Chrome");
            } else if (/msie/i.test(ua)) {
                alert("你是IE浏览器~~~");
            } else if ("ActiveXObject" in window) {
                alert("你是IE11，枪毙了你~~~");
            }

            /*
                         * 如果通过UserAgent不能判断，还可以通过一些浏览器中特有的对象，来判断浏览器的信息
                         * 比如：ActiveXObject
                         */
            // window.ActiveXObject：没有，返回undefined;ActiveXObject没有则会报错
            if ("ActiveXObject" in window) {
                alert("你是IE，我已经抓住你了~~~");
            } else {
                alert("你不是IE~~~");
            }

        }
    </script>
</head>

<body>

</body>

</html>

history

<!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>事件的传播</title>
	<script type="text/javascript">
		window.onload = function () {


			var btn = document.getElementById("btn");
			btn.onclick = function () {
				/*
				可以获取当次访问的链接的数量
					alert(history.length);
				
				back()
				- 可以用来回退到上一个页面，作用和浏览器的回退按钮一样 
					history.back();
 
					
				forward()
				- 可以跳转下一个页面，作用和浏览器的前进按钮一样
					history.forward();
				
				go()
					可以用来跳转到指定的页面
					它需要一个整数作为参数
						1:表示向前跳转一个页面
						-2:表示向后跳转两个页面
				*/

				history.go(1);
			}

		}

	</script>
</head>
<style>
	#box1 {
		width: 300px;
		height: 300px;
		background-color: #bfa;
	}

	#box2 {
		width: 200px;
		height: 200px;
		background-color: rgb(255, 242, 170);
	}

	#box3 {
		width: 100px;
		height: 100px;
		background-color: rgb(255, 170, 213);
	}
</style>

<body>

			<div id="box3">
				<button id="btn">点我一下</button>
				<h1>TEST01</h1>
				<a href="00.html">去00</a>
			</div>

</body>

</html>

location

<!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>事件的传播</title>
	<script type="text/javascript">
		window.onload = function () {


			var btn = document.getElementById("btn");
			btn.onclick = function () {
			/*   如果直接打印location，则可以直接获取路径
					alert(location);
			     更改路径
					location = "http://www.baidu.com";
				如果将属性修改为相对路径，也会跳转
				location = "../0228pp/test02.html";
				*/
				/*
				 assign()
					 	- 用来跳转到其他的页面，作用和直接修改location一样
					
					location.assign("http://www.baidu.com");
 
					
				reload()
					 	- 用于重新加载当前页面，作用和刷新按钮一样
					 	- 如果在方法中传递一个true，作为参数，则会强制清空缓存刷新页面
					
						 现在已经清空了
					location.reload(true);
 
					
				replace()
					 	- 可以使用一个新的页面替换当前页面，调用完毕也会跳转页面
					 		不会生成历史记录，不能使用回退按钮回退
					 */

				
			}

		}

	</script>
</head>
<style>
	#box1 {
		width: 300px;
		height: 300px;
		background-color: #bfa;
	}

	#box2 {
		width: 200px;
		height: 200px;
		background-color: rgb(255, 242, 170);
	}

	#box3 {
		width: 100px;
		height: 100px;
		background-color: rgb(255, 170, 213);
	}
</style>

<body>

	<div id="box3">
		<button id="btn">点我一下</button>
		<h1>TEST01</h1>
		<a href="00.html">去00</a>
	</div>

</body>

</html>

定时器简介

<!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>定时器简介</title>
	<script type="text/javascript">
		window.onload = function () {
			var count = document.getElementById("count");
			/*
				使count中的内容，自动切换
				js 中执行程序是很快的
				for (var i = 0; i < 10; i++) {
				count.innerHTML = i;
			}
			定时调用
			setInterval()将一个函数每隔一段时间执行一次
				参数：
					1.回调函数，每隔一段时间被执行一次
					2.每次调用间隔的时间(ms)
				返回值：
				返回一个number类型的数据
				这个数字用来作为定时器的唯一标识
			*/
			var num = 1;
			var timer=setInterval(function () {
				count.innerHTML = num++;
				if(num==11){
					clearInterval(timer);
				}
			}, 50);
			
			// console.log(timer);//打印定时器标识

			/*
			clearInterval()用来关闭定时器，
			需要一个定时器的标识，这样确定关闭哪个定时器*/
			

		}
	</script>
</head>

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

</html>

定时器

<!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 type="text/javascript">
		window.onload = function () {
			/*使图片自动切换*/
			var img = document.getElementById("img1");
			var btn01 = document.getElementById("btn01");
			var btn02 = document.getElementById("btn02");
			//定时器的标识(全局变量)都可以访问
			var timer;
			btn01.onclick = function () {
				/*
				目前，我们每点一次，就会开启一个定时器图片切换速度过快
				timer代表最后一次
				所以开启之前，关闭其他定时器（同一个元素的，不同元素不用管）
				*/


				var imgArr = ["../0228pp/picture/1 (1).png", "../0228pp/picture/1 (2).png", "../0228pp/picture/1 (3).png"];
				//创建一个变量，用来保存当前图片的索引
				var index = 0;

				/*开启定时器之前关闭上一个定时器*/
				clearInterval(timer);

				/*开启定时器，自动切换图片*/
				timer = setInterval(function () {


					img1.src = imgArr[index];
					index++;
					console.log(index);
					/*if (index >= imgArr.length) {
						//将index设置为0
						index = 0;
					}*/
					index = index % imgArr.length;
				}, 1000);
			}
			//点击按钮以后，停止自动切换
			btn02.onclick = function () {
				clearInterval(timer);
			}

		}

	</script>
</head>

<style>

</style>

<body>
	<img id="img1" src="../0228pp/picture/1 (1).png" alt="">
	<br>
	<button id="btn01">开始</button>
	<button id="btn02">停止</button>
</body>

</html>

定时器贪吃蛇

<!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>div移动游戏</title>
	<script type="text/javascript">
		window.onload = function () {
			var box1 = document.getElementById("box1");
			var speed = 10;
			//穿甲你一个变量代表方向
			// var dir = 39;
			document.onkeydown = function (event) {
				if (event.ctrlKey) {
					speed = 50;
				}
				else {
					speed = 10;
				}
				dir = event.keyCode;
			}
			//定时器
			setInterval(function () {
				switch (dir) {
					case 37:
						//alert("向左"); left值减小
						box1.style.left = box1.offsetLeft - speed + "px";
						break;
					case 39:
						//alert("向右");
						box1.style.left = box1.offsetLeft + speed + "px";
						break;
					case 38:
						//alert("向上");
						box1.style.top = box1.offsetTop - speed + "px";
						break;
					case 40:
						//alert("向下");
						box1.style.top = box1.offsetTop + speed + "px";
						break;
				}

			}, 100);

			//按键松开时，
			document.onkeyup = function () {
			//（如果这样设置，当抬起键盘，定时器就失效了，box1就会立在原地无法移动）
// clearInterval(timer);
				//设置方向为0，为null也可以
				dir = 0;
			}

		}
	</script>
</head>

<style>
	* {
		/*一定要加上，否则就出错了*/
		margin: 0;
		padding: 0;

	}

	#box1 {
		width: 100px;
		height: 100px;
		background-color: #bfa;
		position: relative;
	}
</style>

<body>
	<div id="box1"></div>
</body>

</html>

定时器移动函数

<!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>定时器向右移动</title>
	<script type="text/javascript">

		window.onload = function () {
			var timer;//把timer设置为全局变量
			var box1 = document.getElementById("box1");
			var btn01 = document.getElementById("btn01");
			var btn02 = document.getElementById("btn02");
			btn01.onclick = function () {
				// box1.style.left=200+"px";
				// box1.style.left="200px";

				//关闭上一次定时器
				clearInterval(timer);


				//开启定时器
				timer = setInterval(function () {


					/*先获取原来的box1原来的left值
				变成number类型的，输出就会是0，而不是0px
				*/
					var oldValue = parseInt(getStyle(box1, "left"));
					/*
					这个地方得到的值没有办法直接相加减，只会进行字符串的拼串，
					比如0px+10=0px10
					 alert(oldValue);
					*/
					//在旧值的基础上修改,并赋值
					var newValue = oldValue + 11;

					//当元素移动到800px，停止
					if (newValue >= 800) {
						newValue = 800;
					}
					box1.style.left = newValue + "px";
					if (newValue == 800) {
						clearInterval(timer);
					}

				}, 30);


			}

			btn02.onclick = function () {
				move(box1, 0, 10);


			}

			/*尝试创建一个简单动画的函数
			参数 obj，要执行动画的对象
			target 目标位置
			speed 移动的速度
			*/
			function move(obj, target, speed) {
				//关闭上一次定时器
				clearInterval(timer);
				/*判断speed的正负值
				向右移动，正值
				向左移动，负值*/
				var current = parseInt(getStyle(obj, "left"));
				if (current > target) {//想向左移
					speed = -speed;
				}
				//开启定时器
				timer = setInterval(function () {

					var oldValue = parseInt(getStyle(obj, "left"));

					//在旧值的基础上修改,并赋值
					var newValue = oldValue +speed;

					//当元素移动到800px，停止
					if ((speed < 0 && newValue < target) || (speed > 0 && newValue > target)) {
						newValue = target;
					}

					obj.style.left = newValue + "px";
					if (newValue == target) {
						clearInterval(timer);
					}

				}, 30);
			}
		}


		/*放在全局作用域里面
		自行定义函数，获取现在的样式
			变量用【】声明
		第二个参数，记得用"width",""
		*/

		function getStyle(obj, name) {
			if (window.getComputedStyle) {

				//正常浏览器
				return getComputedStyle(obj, null)[name];
			}

			else {//IE8的方式
				return obj.currentStyle[name];

			}

		}




	</script>
</head>
<style>
	* {
		margin: 0;
		padding: 0;
	}

	#box1 {
		width: 100px;
		height: 100px;
		background-color: red;
		position: absolute;
		left: 0;
		/*因为在IE中，没有指定的值，会变成auto*/
	}
</style>

<body>
	<button id="btn01">点击按钮以后向右移动</button>
	<button id="btn02">点击按钮以后向左移动</button>
	<br><br>
	<div id="box1"></div>
</body>

</html>

定时器移动（三）

<!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>定时器移动</title>
	//<script src="./script/tool.js"></script>
	<script type="text/javascript">
		var timer;//把timer设置为全局变量
		window.onload = function () {

			var box1 = document.getElementById("box1");
			var box2 = document.getElementById("box2");
			var btn01 = document.getElementById("btn01");
			var btn02 = document.getElementById("btn02");
			var btn03 = document.getElementById("btn03");
			var btn04 = document.getElementById("btn04");
			btn01.onclick = function () {

				move(box1, "left", 800, 10);
			}

			btn02.onclick = function () {
				move(box1, "left", 0, 10);


			}

			/*目前，所有的定时都由全局变量timer标识
			所有执行正在执行的定时器都在这个变量中保存
			*/
			btn03.onclick = function () {
				move(box2, "left", 800, 10);

			}
			btn04.onclick = function () {
				//move(box2,"width", 800, 10);
				//move(box2, "top", 800, 10);
				//套娃
				move(box2, "width", 800, 10, function () {
					// alert("动画执行完毕");
					move(box2, "height", 400, 10, function () {

						move(box2, "top", 0, 10, function () { });
					});
				});
			}

			/*尝试创建一个简单动画的函数
			参数 obj，要执行动画的对象
			attr 要修改动画的样式，left top width,height
			target 目标位置
			speed 移动的速度
			callback 回调函数，将会在动画执行完毕以后执行
			*/
			function move(obj, attr, target, speed, callback) {
				//关闭上一次定时器
				clearInterval(obj.timer);
				/*判断speed的正负值
				向右移动，正值
				向左移动，负值*/
				var current = parseInt(getStyle(obj, attr));
				if (current > target) {//想向左移
					speed = -speed;
				}
				//开启定时器

				//向执行动画的对象中添加一个timer属性，用来保存它自己的定时器标识
				obj.timer = setInterval(function () {

					var oldValue = parseInt(getStyle(obj, attr));

					//在旧值的基础上修改,并赋值
					var newValue = oldValue + speed;

					//当元素移动到800px，停止
					if ((speed < 0 && newValue < target) || (speed > 0 && newValue > target)) {
						newValue = target;
					}
					//因为attr是个变量，所以修改的时候要加上【】
					obj.style[attr] = newValue + "px";
					if (newValue == target) {
						clearInterval(obj.timer);
						/*动画执行完毕，调用回调函数
						如果传回调函数了，就执行，如果没传回调函数，不执行
						*/
						callback && callback();
					}

				}, 30);
			}
		}


		/*放在全局作用域里面
		自行定义函数，获取现在的样式
			变量用【】声明
		第二个参数，记得用"width",""
		*/

		function getStyle(obj, name) {
			if (window.getComputedStyle) {

				//正常浏览器
				return getComputedStyle(obj, null)[name];
			}

			else {//IE8的方式
				return obj.currentStyle[name];

			}

		}




	</script>
</head>
<style>
	* {
		margin: 0;
		padding: 0;
	}

	#box1 {
		width: 100px;
		height: 100px;
		background-color: red;
		position: absolute;
		left: 0;
		/*因为在IE中，没有指定的值，会变成auto*/
	}

	#box2 {
		width: 100px;
		height: 100px;
		top: 300px;
		background-color: rgb(165, 202, 62);
		position: absolute;
		left: 0;
		/*因为在IE中，没有指定的值，会变成auto*/
	}
</style>

<body>
	<button id="btn01">点击按钮以后向右移动</button>
	<button id="btn02">点击按钮以后向左移动</button>
	<button id="btn03">点击按钮以后向右移动</button>
	<button id="btn04">测试按钮</button>
	<br><br>
	<div id="box1"></div>
	<br><br>
	<div id="box2"></div>
</body>

</html>

老版本定时器tool,js


//<script src="./script/tool.js"></script>


function move(obj, attr, target, speed, callback) {
    //关闭上一次定时器
    clearInterval(obj.timer);
    /*判断speed的正负值
    向右移动，正值
    向左移动，负值*/
    var current = parseInt(getStyle(obj, attr));
    if (current > target) {//想向左移
        speed = -speed;
    }
    //开启定时器

    //向执行动画的对象中添加一个timer属性，用来保存它自己的定时器标识
    obj.timer = setInterval(function () {

        var oldValue = parseInt(getStyle(obj, attr));

        //在旧值的基础上修改,并赋值
        var newValue = oldValue + speed;

        //当元素移动到800px，停止
        if ((speed < 0 && newValue < target) || (speed > 0 && newValue > target)) {
            newValue = target;
        }
        //因为attr是个变量，所以修改的时候要加上【】
        obj.style[attr] = newValue + "px";
        if (newValue == target) {
            clearInterval(obj.timer);
            /*动画执行完毕，调用回调函数
            如果传回调函数了，就执行，如果没传回调函数，不执行
            */
            callback && callback();
        }

    }, 30);
}



/*放在全局作用域里面
自行定义函数，获取现在的样式
变量用【】声明
第二个参数，记得用"width",""
*/

function getStyle(obj, name) {
if (window.getComputedStyle) {

    //正常浏览器
    return getComputedStyle(obj, null)[name];
}

else {//IE8的方式
    return obj.currentStyle[name];

}

}

tool.js

/*obj指定是移动的对象
dir指的是移动方向
target指定是目的地位置
speed移动速度
callback 回调函数
*/
function move(obj, dir, target, speed, callback) {
//关闭上一次定时器
clearInterval(obj.timer);
	//获取当前方向
	var cur = window.getComputedStyle(obj, null);
	var current = parseInt(cur[dir]);
	//首先判断速度为正还是为负
	if (current > target) {
		speed = -speed;
	}


	obj.timer=setInterval(function () {
		//获取当前位置的值
		var old = window.getComputedStyle(obj, null);
		var oldValue = parseInt(old[dir]);
		var newValue = oldValue + speed;

		if((speed>0&&newValue>target)||(speed<0&&newValue<target)){
			newValue=target;
		}

		//设置属性
		obj.style[dir]=newValue+"px";
		if(newValue==target){
			clearInterval(obj.timer);
			//如果callback存在，就执行callback，而且加不加括号的顺序不能弄错
			callback&&callback();
		}

	}, 1000);
}

轮播图

<!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>轮播图</title>
    <link rel="stylesheet" href="../css重置样式表/reset.css">
    <!-- <script src="./script/tool.js"></script> -->
    <script src="./script/script.js"></script>
    <script type="text/javascript">

        window.onload = function () {
            var outer = document.getElementById("outer");
            var imgList = document.getElementById("img-list");
            //获取页面中所有img标签
            var imgArr = document.getElementsByTagName("img");

            //设置imglist的宽度
            imgList.style.width = 259 * imgArr.length + "px";

            var nav = document.getElementById("nav");
            //设置nav居中
            nav.style.left = (outer.offsetWidth - nav.offsetWidth) / 2 + "px";


            //获取所有的a
            var allA = document.getElementsByTagName("a");
            //默认显示图片的 索引
            var index = 0;

            // allA[index].style.background = "blue";
            /*点击超链接，切换到指定图片
            点击第一个链接，显示第一个图片
            点击第二个链接，显示第二个图片
            */
            var num;
            for (var i = 0; i < allA.length; i++) {
                //为每一个超链接添加一个num属性，保存它本身是第几个链接
//关闭自动切换的定时器
clearInterval(timer);
                allA[i].num = i;
                allA[i].onclick = function () {
                    /*获取点击超链接的索引，并将其设置为index
                    得用this，用allA[i]不对
                    */
                    index = this.num;
                    //切换图片,修改imgList
                    //  imgList.style.left = (-259) * index + "px";
                    //修改正在选中的a
                    setA();
                    //使用move函数切换图片
                    move(imgList, "left", (-259) * index, 10, function () { });
                    //动画执行完毕，开启自动切换
                    autoChange();
                }

            }
           
            //创建一个方法，用来设置选中的a
            function setA() {

                //判断当前索引是否是最后一个
                if (index >= imgArr.length-1) {
                    //则将index设置为0
                    index = 0;
                     //最后一张和第一张是一模一样的
                imgList.style.left=0;
                }
               


                //遍历所有的a,并设置为orange
                for (var i = 0; i < allA.length; i++) {
                    /*因为这个地方为内联样式，要是在这个地方设置，就没有办法修改了，所以在css里面设置*/
                    allA[i].style.background = "";
                }
                allA[index].style.background = "blue";
            }
            var timer;
            //创建一个函数，实现自动切换图片
            function autoChange() {
                //开启定时器，定时切换图片
                 timer=setInterval(function () {

                    //使索引自增
                    index++;
                    index %= imgArr.length;
                    //执行动画，切换图片
                    move(imgList, "left", (-259) * index, 10, function () {
                        //修改导航点
                        setA();
                    });
                }, 1000);
            }
        }
    </script>
</head>
<style>
    * {
        margin: 0;
        padding: 0;
    }

    #outer {
        width: 259px;
        height: 186px;
        margin: 50px auto;
        background-color: aqua;
        position: relative;
        /*裁剪溢出的内容，只想看到中间那张*/
        overflow: hidden;
    }

    #img-list {
        /* width: 781px; */

        position: absolute;
        /*每向左移动259px，就会显示下一张图片*/
        left: -518px;
    }

    #img-list li {
        float: left;
        margin: 0 10px;

    }

    #nav {
        position: absolute;
        /* width: 63px;
        left: 0;
        right: 0;
        margin: 0 auto; */
        bottom: 15px;

    }

    #nav a {
        /*浮动以后，会变成块元素
        行内元素浮动后相当于inline-block
        */
        float: left;
        /* display: block; */
        width: 11px;
        height: 11px;
        background-color: orange;
        /*点点一开始在下面了，因为绝对定位脱离文档流，nav自然而然就上去了*/
        margin: 0 5px;
        /*设置半透明效果*/
        opacity: 0.5;

    }

    #nav a:hover {
        background-color: blue;
    }
</style>

<body>
    <div id="outer">
        <ul id="img-list">
            <li><img src="./picture/1 (1).png" alt=""></li>
            <li><img src="./picture/1 (2).png" alt=""></li>
            <li><img src="./picture/1 (3).png" alt=""></li>

            <li><img src="./picture/1 (1).png" alt=""></li>
        </ul>
        <!-- 创建导航按钮 -->
        <div id="nav">
            <a href="javascript:;"></a>
            <a href="javascript:;"></a>
            <a href="javascript:;"></a>


        </div>
    </div>
</body>

</html>

木一叶liuyue

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
js基础6 Navigator/history/location/定时器简介/定时器贪吃蛇/切换图片/移动函数/tool.js轮播图

Navigator<!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"> <
复制链接

扫一扫