前端补充20

一、修改样式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!--修改样式-->
    <input type="button" value="修改样式" id="btn">
    <div id="dv"></div>
    <script>
        let btn = document.getElementById("btn");
        btn.onclick=function(){
            let dv = document.getElementById("dv");
            dv.style.width="300px";
            dv.style.height="300px";
            dv.style.backgroundColor = "pink";
        }
    </script>
</body>
</html>

二、获取类样式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .cls{
            width: 300px;
            height: 300px;
            background-color: pink;
        }
    </style>
</head>
<body>
    <!--获取类样式-->
    <input type="button" value="修改样式" id="btn">
    <div id="dv"></div>
    <script>
        let btn = document.getElementById("btn");
        btn.onclick = function(){
            //在js中操作类 className 公式  cls不要加点
            document.getElementById("dv").className = "cls";//"cls"前面不要加点
        }
    </script>
</body>
</html>

三、用className实现一个按钮显示和隐藏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{
            width: 300px;
            height: 200px;
            background-color: skyblue;
        }
        .cls{
            /*这个类是控制隐藏的*/
            display: none;
        }
    </style>
</head>
<body>
    <!--用className实现一个按钮显示和隐藏-->
    <input type="button" value="隐藏" id="btn">
    <div id="dv" class="cls"></div>
    <script>
        let btn = document.getElementById("btn");
        btn.onclick = function(){
            //console.log(document.getElementById("dv").className);这里面的如果对象有class类，会返回其class对象，如果没有就为空
            if(document.getElementById("dv").className!="cls"){
                document.getElementById("dv").className = "cls";
                this.value = "显示";
            }
            else{
                document.getElementById("dv").className = "";
                this.value = "隐藏";
            }
        }
    </script>
</body>
</html>

四、网页开关灯

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .cls{
            background-color: black;
        }
    </style>
</head>
<body>
    <!--网页开关灯-->
    <input type="button" value="开/关灯" id="btn">
    <script>
        //获取body标签 document.body 能拿到body标签的
        let btn = document.getElementById("btn");
        btn.onclick = function(){
            document.body.className = document.body.className !='cls'?"cls":"";
        }
    </script>
</body>
</html>

五、修改列表

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!--修改列表-->
    <input type="button" value="变背景色" id="btn">
    <ul id="uu">
        <li>卡卡西</li>
        <li>大蛇丸</li>
        <li>我爱罗</li>
        <li>鸣人</li>
        <li>佐助</li>
    </ul>

    <script>
        let btn = document.getElementById("btn");
        btn.onclick = function(){
            document.getElementById("uu").style.backgroundColor = "skyblue";
        }
    </script>
</body>
</html>

六、阻止a链接 跳转

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!--阻止a链接 跳转-->
   <!--<a href="https://www.baidu.com" onclick="alert('我被点击了'); return false">百度</a>-->
   <a href="https://www.baidu.com" id="ak">百度</a>
   <script>
    //阻止a链接跳转 return false
    let ak = document.getElementById("ak");
    ak.onclick = function(){
        alert("我被点击了");
        return false;

    }

   </script>
</body>
</html>

七、点击小图变大图

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!--点击小图变大图-->
    <a href="images/1.jpg" id="ak"><img src="images/2.jpg" alt=""></a>
    <img src="" alt="" id="big">
    <script>
        let ak = document.getElementById("ak");
        ak.onclick = function(){
            document.getElementById("big").src = this.href;
            return false;//不允许跳转
        }
    </script>
</body>
</html>

八、相册模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
            font-family: "宋体";
            color: #333;
            background-color: #ccc;
            margin: 1em 10%;
        }
        h1{
            color: #333;
            background-color: transparent;
        }
        a{
            color: #c60;
            background-color: transparent;
            font-weight: bold;
            text-decoration: none;
        }

        ul{
            padding: 0;
        }
        li{
            float: left;
            padding: 1em;
            list-style: none;
        }
        #imagegallery{
            list-style: none;
        }
        #imagegallery li{
            margin: 0px 20px 20px 0px;
            padding: 0px;
            display: inline;
        }
        #imagegallery li a img{
            border:0;
        }
    </style>
</head>
<body>
    <!--相册模板-->
    <h2>
        美女画廊
    </h2>

    <ul id="imagegallery">
        <li><a href="images/4.jpg" title="美女A">
            <img src="images/4-small.jpg" width="100" alt="美女1"/>
        </a></li>
        <li><a href="images/5.jpg" title="美女B">
            <img src="images/5-small.jpg" width="100" alt="美女2"/>
        </a></li>
        <li><a href="images/6.jpg" title="美女C">
            <img src="images/6-small.jpg" width="100" alt="美女3"/>
        </a></li>
        <li><a href="images/7.jpg" title="美女D">
            <img src="images/7-small.jpg" width="100" alt="美女4"/>
        </a></li>
    </ul>

    <div style="clear: both"></div>
    <!--显示大图的-->
    <img id="image" src="images/under.jpg" alt="" width="450"/>
    <p id="des">选择一个图片</p>

    <script>
        //从ul的标签获取所有的a标签
        let aObjs = document.getElementById("imagegallery").getElementsByTagName("a");
        for(let i=0;i<aObjs.length;i++){
            //给每个a链接做点击事件
            aObjs[i].onclick = function(){
                //获取id为image的标签的src赋值
                document.getElementById("image").src = this.href;
                //获取id为des的innerText赋值链接的title
                document.getElementById("des").innerText = this.title;
                return false;
            }
        }
    </script>
</body>
</html>

九、各行换色

//封装一个获取id 的函数
function my$(id){
    return  document.getElementById(id);
}

将其命名为public.js

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!--各行换色-->
    <input type="button" value="各行换色" id="btn">
    <ul id="uu">
        <li>红旗</li>
        <li>五菱宏光</li>
        <li>奔驰</li>
        <li>兰博基尼</li>
        <li>哈弗</li>
        <li>奥迪</li>
    </ul>
    <script src="public.js"></script>
    <script>
        my$("btn").onclick = function(){
            let list = document.getElementsByTagName("li");
            for(let i=0;i<list.length;i++){
                if(i % 2 == 0){
                    list[i].style.backgroundColor = "red";
                }
                else{
                    list[i].style.backgroundColor = "yellow";
                }
            }
        }
    </script>
</body>
</html>

十、经过列表变色

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        ul{
            list-style: none;
            cursor: pointer;/*鼠标表变为小手*/
        }
    </style>
</head>
<body>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
        <li>7</li>
        <li>8</li>
    </ul>
    <script src="public.js"></script>
    <script>
        let list = document.getElementsByTagName("li");
        for(let i=0;i<list.length;i++){
            list[i].onmouseover = function(){
                this.style.backgroundColor = "pink";
            }
            list[i].onmouseout = function(){
                this.style.backgroundColor = "";
            }
        }
    </script>
</body>
</html>

十一、通过name属性获取元素

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!--通过name属性获取元素-->
    <input type="button" value="显示按钮" id="btn"><br />
    <input type="text" value="完蛋了，语法在一起全混了" name="name1"><br />
    <input type="text" value="完蛋了，语法在一起全混了" name="name2"><br />
    <input type="text" value="完蛋了，语法在一起全混了" name="name3"><br />
    <input type="text" value="完蛋了，语法在一起全混了" name="name1"><br />
    <input type="text" value="完蛋了，语法在一起全混了" name="name1"><br />
    <input type="text" value="完蛋了，语法在一起全混了" name="name1"><br />
    <script src="public.js"></script>

    <script>
        my$("btn").onclick = function(){

            let inputs = document.getElementsByName("name1");
            for(let i=0;i<inputs.length;i++){
                inputs[i].value = "加油，继续学习吧";
            }
        }
    </script>
</body>
</html>

十二、 根据类样式获取元素

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{
            width: 300px;
            height: 50px;
            background-color: pink;
            margin-top: 10px;
        }
        .cls{
            background-color: skyblue;
        }
    </style>
</head>
<body>
    <!--根据类样式获取元素-->
    <input type="button" value="显示效果" id="btn">
    <p class="cls">这是第一个p标签</p>
    <p>这是第二个p标签</p>
    <span class="cls">这是第一个span标签</span><br />
    <span>这是第二个span标签</span><br />
    <div class="cls">这是第一个div标签</div>
    <div>这是第二个div标签</div>

    <script src="public.js"></script>
    <script>
        //点击按钮带cls的类，将其变色
        my$("btn").onclick = function(){
            let objs = document.getElementsByClassName("cls");
            for(let i = 0;i < objs.length; i++){
                objs[i].style.backgroundColor = "red";
            }
        }
    </script>
</body>
</html>

十三、其他方式获取元素

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .cls{
            background-color: skyblue;
        }
    </style>
</head>
<body>
    <!--其他方式获取元素-->
    <input type="button" value="显示效果" id="btn">
    <p class="cls">这是第一个p标签</p>
    <p>这是第二个p标签</p>
    <div class="cls">这是第一个div标签</div>
    <div>这是第二个div标签</div>

    <script src="public.js"></script>
    <script>
        //总结：根据id获取元素方式之前的写法如下：
        // let btn = document.getElementById("btn");
        // let btnObj = document.querySelector("#btn");//注意这个方式要带选择器 id 就要带 #
        // btnObj.onclick = function(){
        //     alert("666");
        // }
        let objs = document.querySelectorAll(".cls");//集合
        for(let i=0;i<objs.length;i++){
            objs[i].style.backgroundColor = "pink";//注意这个方式要带选择器 就要带 .
        }

        /*
        总结：
        根据id获取元素
        1.document.getElementById("id的属性");
        根据标签获取元素
        2.document.getElementByTagName("标签名");
        根据name名称获取元素
        3.document.getElementByName("name的属性名");
        根据类样式获取元素
        4.document.getElementByClassName("类样式名称");
        根据选择器获取元素
        5.document.querySelector("#btn")
        6.document.querySelectorAll(".cls");
        7.document.body  专门获取body的
        */
    </script>
</body>
</html>

总结：


        根据id获取元素
        1.document.getElementById("id的属性");
        根据标签获取元素
        2.document.getElementByTagName("标签名");
        根据name名称获取元素
        3.document.getElementByName("name的属性名");
        根据类样式获取元素
        4.document.getElementByClassName("类样式名称");
        根据选择器获取元素
        5.document.querySelector("#btn")
        6.document.querySelectorAll(".cls");
        7.document.body  专门获取body的

十四、鼠标经过显示边框

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        div{
            width: 200px;
            height: 150px;
            background-color: pink;
            float: left;
            margin-left: 10px;
            border: 2px solid pink;/*避免后面加边框错位*/
        }

    </style>
</head>
<body>
    <!--鼠标经过显示边框-->
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>

    <script src="public.js"></script>
    <script>
        let divs = document.getElementsByTagName("div");
        for(let i=0;i<divs.length;i++){
            divs[i].onmouseover = function(){
                this.style.border = "2px solid red";
            }
            divs[i].onmouseout = function(){
                this.style.border = "";
            }
        }
    </script>
</body>
</html>

十五、搜索效果

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        input{
            color: gray;
            /*外面的样式不在变换*/
            outline: none;
        }
    </style>
</head>
<body>
    <!--搜索效果-->
    <input type="text" value="请输入搜索内容" id="txt">
    <script src="public.js"></script>
    <script>
        //获取焦点事件 onfouse
        my$("txt").onfocus = function(){
            //判断自己有没有值
            if(this.value == "请输入搜索内容"){
                this.value = "";
                this.style.color = "black";
            }
        }

        //失去焦点onblur
        my$("txt").onblur = function(){
            //判断
            if(this.value == ""){
                this.value = "请输入搜索内容";
                this.style.color = "gray";
            }
        }
    </script>
</body>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mfbz.cn/a/576471.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

代码随想录-算法训练营day24【回溯01：理论基础、组合】

代码随想录-算法训练营day24【回溯01：理论基础、组合】

代码随想录-035期-算法训练营【博客笔记汇总表】-CSDN博客 第七章 回溯算法part01 今日内容&#xff1a;● 理论基础 ● 77. 组合 详细布置 理论基础 其实在讲解二叉树的时候&#xff0c;就给大家介绍过回溯&#xff0c;这次正式开启回溯算法&#xff0c;大家可以先看视频&a…
阅读更多...
docker入门级命令

docker入门级命令

基本概念 docker的连个基本概念&#xff1a;镜像、容器。 docker镜像可以理解为是存储docker安装包的地方&#xff0c;比如&#xff1a;mcr.microsoft.com/mssql/server:2017-latest是sqlserver的docker镜像。 可以通过docker pull命令拉取远程镜像到本地。比如&#xff1a;…
阅读更多...
【论文浅尝】Phi-3-mini：A Highly Capable Language Model Locally on Your Phone

【论文浅尝】Phi-3-mini：A Highly Capable Language Model Locally on Your Phone

Phi-3-mini phi-3-mini&#xff0c;一个3.8亿个参数的语言模型&#xff0c;训练了3.3万亿个token&#xff0c;其总体性能&#xff0c;通过学术基准和内部测试进行衡量&#xff0c;可以与Mixtral 8x7B和GPT-3.5等模型相媲美(在MMLU上达到69%&#xff0c;在MT-bench上达到8.38)&…
阅读更多...
什么是云手机？云手机有什么用？

什么是云手机？云手机有什么用？

过去&#xff0c;我们手中的手机是我们生活、工作、娱乐的得力助手&#xff0c;但随着时代的变迁和技术的发展&#xff0c;我们需要的不仅仅是一部手机&#xff0c;而是一个更强大、更灵活的工具。在这个时候&#xff0c;云手机横空出世&#xff0c;成为了我们手机使用的新选择…
阅读更多...
[GXYCTF 2019]BabyUpload

[GXYCTF 2019]BabyUpload

过滤 <? 且后缀不能有 php 上传1.jpg文件&#xff0c;内容为&#xff1a; <script languagephp>eval($_POST[cmd]);</script> 但文件后缀为.jpg&#xff0c;蚁剑不能连接。那怎么办呢&#xff1f; .htaccess文件&#xff1a;解析.jpg文件中的php代码 &#xf…
阅读更多...
Druid高性能数据库连接池？SpringBoot整合MyBatis整合SpringMVC整合Druid

Druid高性能数据库连接池？SpringBoot整合MyBatis整合SpringMVC整合Druid

文章目录 Druid高性能数据库连接池&#xff1f;SpringBoot整合MyBatis整合SpringMVC整合Druid异常记录spring-boot-starter-parent作用Druid介绍什么是数据库连接池&#xff1f;为什么选择Druid数据库连接池整合SpringBoot,MyBatis,SpringMVC,Druid到Maven项目的真个流程pom文件…
阅读更多...
Redis入门到实战教程（基础篇）笔记

Redis入门到实战教程（基础篇）笔记

教学来源&#xff1a; Redis课程介绍导学_哔哩哔哩_bilibilihttps://www.bilibili.com/video/BV1cr4y1671t?p1一、Redis 入门 1.认识NoSQL 2.Redis在虚拟机中的安装和开机自启 Redis在虚拟机中安装和配置开机自启-CSDN博客https://blog.csdn.net/qq_69183322/article/deta…
阅读更多...
MT8788智能模块简介_MTK联发科安卓核心板方案厂商

MT8788智能模块简介_MTK联发科安卓核心板方案厂商

MT8788安卓核心板是一款具备超高性能和低功耗的4G全网通安卓智能模块。该模块采用联发科AIOT芯片平台&#xff0c;供货周期长。 MT8788核心板搭载了12nm制程的四个Cortex-A73处理器核心和四个Cortex-A53处理器核心&#xff0c;最高主频可达2.0GHz。板载内存容量可选为4GB64GB(也…
阅读更多...
docker 基本命令

docker 基本命令

目录 一、docker 镜像操作命令 1.1.查询软件镜像 1.2.docker pull&#xff1a;下载镜像 1.3.docker push&#xff1a;上传镜像 1.4.docker images&#xff1a;查看本地镜像 1.5.docker inspect &#xff1a;获取镜像详细信息 1.6.docker tag&#xff1a;添加镜像标签 …
阅读更多...
4.28|重量级嘉宾携卓翼飞思RflySim平台亮相国际盛会，内容抢先看！

4.28|重量级嘉宾携卓翼飞思RflySim平台亮相国际盛会，内容抢先看！

一. 大会背景 2024国际无人机应用及防控大会暨无人机产业博览会即将拉开帷幕&#xff0c;一场高规格、高水平的无人机产业应用国际盛会将再次点亮科技界的星空。 该大会由中国无人机产业创新联盟联合各方有影响力的单位&#xff0c;于4月27-29日在北京举办。组委会致力于将会…
阅读更多...
【Python系列】受保护属性

【Python系列】受保护属性

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…
阅读更多...
RAG原理及本地化实践

RAG原理及本地化实践

基于LLM的应用在问题回答、信息获取上发挥出了巨大作用。这些通用大模型训练的数据主要来源于互联网上的会话或者个别机构提供的数据&#xff0c;虽然能够提供类似人的交互对答&#xff0c;但是在针对某个特定领域的时候就显得不足。通用大模型在应用中主要有以下问题&#xff…
阅读更多...
【DINO】环境配置

【DINO】环境配置

1. DINO简介 作为一款基于Transformer性能强劲的计算机视觉算法&#xff0c;一经发布即受追捧&#xff0c;本文记录下在DINO官方代码在集群上的环境配置及训练自己的数据集过程。 DINO原文&#xff1a;https://arxiv.org/abs/2203.03605 DINO源代码&#xff1a;https://github.…
阅读更多...
ssm084基于ssm的大型商场会员管理系统+jsp

ssm084基于ssm的大型商场会员管理系统+jsp

大型商场会员管理系统的设计与实现 摘 要 进入信息时代以来&#xff0c;很多数据都需要配套软件协助处理&#xff0c;这样可以解决传统方式带来的管理困扰。比如耗时长&#xff0c;成本高&#xff0c;维护数据困难&#xff0c;数据易丢失等缺点。本次使用数据库工具MySQL和编…
阅读更多...
【C语言必刷题】7. 百钱百鸡

【C语言必刷题】7. 百钱百鸡

&#x1f4da;博客主页&#xff1a;爱敲代码的小杨. ✨专栏&#xff1a;《Java SE语法》 | 《数据结构与算法》 | 《C生万物》 |《MySQL探索之旅》 |《Web世界探险家》 ❤️感谢大家点赞&#x1f44d;&#x1f3fb;收藏⭐评论✍&#x1f3fb;&#xff0c;您的三连就是我持续更…
阅读更多...
《汇编语言》- 读书笔记 - 综合研究

《汇编语言》- 读书笔记 - 综合研究

《汇编语言》- 读书笔记 - 综合研究 研究试验 1 搭建一个精简的 C 语言开发环境1. 下载2. 配置3. 编译4. 连接 研究试验 2 使用寄存器1. 编一个程序 ur1.c &#xff08; tcc 用法&#xff09;tcc 编译连接多个源文件tlink 手动连接 2.用 Debug 加载 ur1.exe&#xff0c;用u命令…
阅读更多...
数据转换 | Matlab基于RP递归图一维数据转二维图像方法

数据转换 | Matlab基于RP递归图一维数据转二维图像方法

目录 效果分析基本介绍程序设计参考资料获取方式 效果分析 基本介绍 Matlab基于RP递归图一维数据转二维图像方法 基于RP&#xff08;Recurrence Plot&#xff09;递归图的方法可以将一维数据转换为二维图像&#xff0c;以可视化数据的动态特征。RP递归图是一种表示时间序列相…
阅读更多...
android 去除桌面谷歌搜索框

android 去除桌面谷歌搜索框

注&#xff1a; 本文只是博主学习记录分享&#xff0c;仅供参考。如有错误请指出来&#xff0c;谢谢&#xff01; 一、问题描述 去除 android 系统桌面谷歌搜索栏&#xff0c;前后对比如下图&#xff1a; 系统版本&#xff1a;android12 平台&#xff1a;rk3568 二、…
阅读更多...
【小浩算法cpp题解】判断环形链表

【小浩算法cpp题解】判断环形链表

目录 前言我的思路思路一 &#xff08;哈希表记录链表的访问&#xff09;&#xff1a;思路二 &#xff08;双指针&#xff0c;快指针在前&#xff0c;慢指针在后&#xff09;&#xff1a; 我的代码运行结果 前言 前几天我写的代码&#xff0c;都是把所有的内容写在main函数里&…
阅读更多...
Veeam配置备份oracle实例

Veeam配置备份oracle实例

Veeam是一家专门提供数据管理和数据保护解决方案的软件公司。他们的产品主要包括备份、复制和虚拟化管理等功能&#xff0c;旨在帮助企业保护其数据、应用程序和系统&#xff1b;NBU&#xff0c;COMMVALT&#xff0c;Veeam 国际三大知名备份软件厂商。本文介绍使用Veaam 备份Li…
阅读更多...
最新文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发 尧图建网站