Hello,我是小恒不会java
使用vscode自然会使用代码片段,我把我的部分代码片段分享出来
分别是html.json,css.json,javascript.json,python.json
前言
vscode代码片段介绍与规范
https://juejin.cn/post/7091285766759940104
代码片段快速生成
https://snippet-generator.app/
代码
html.json
{
// Place your snippets for html here. Each snippet is defined under a snippet name and has a prefix, body and
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
// same ids are connected.
// Example:
// "Print to console": {
// "prefix": "log",
// "body": [
// "console.log('$1');",
// "$2"
// ],
// "description": "Log output to console"
// }
"html基本模板单文件": {
"prefix": "h",
"body": [
"<!DOCTYPE html>",
"<html lang=\"zh-CN\">",
"<!-- 英语就是en -->",
" <head>",
" <meta charset=\"UTF-8\">",
" <meta name=\"apple-mobile-web-app-capable\" content=\"yes\">",
" <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
" <meta name=\"keywords\" content=\"\" />",
" <meta name=\"author\" content=\"\">",
" <meta name=\"description\" content=\"\" />",
" <link rel=\"Shortcut Icon\" href=\"http://web.yunduanjianzhan.cn/images/logos/favicon.ico\" type=\"image/x-icon\" />",
" <title>Hello,world!</title>",
" </head>",
" <body>",
" ",
"",
" <style>",
" ",
" </style>",
" ",
" <script>",
" ",
" </script>",
" </body>",
" </html>"
],
"description": ""
},
"html基本模板多文件": {
"prefix": "h",
"body": [
"<!DOCTYPE html>",
"<html lang=\"zh-CN\">",
"<!-- 英语就是en -->",
" <head>",
" <meta charset=\"UTF-8\">",
" <meta name=\"apple-mobile-web-app-capable\" content=\"yes\">",
" <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
" <meta name=\"keywords\" content=\"\" />",
" <meta name=\"author\" content=\"\">",
" <meta name=\"description\" content=\"\" />",
" <link rel=\"Shortcut Icon\" href=\"http://web.yunduanjianzhan.cn/images/logos/favicon.ico\" type=\"image/x-icon\" />",
" <link rel=\"stylesheet\" href=\"css/index.css\">",
" <title>Hello World!</title>",
" </head>",
" <body>",
" ",
" <script src=\"js/index.js\"></script>",
" </body>",
" </html>"
],
"description": ""
},
"html基本模板多文件flask": {
"prefix": "h",
"body": [
"app = Flask(__name__)<!DOCTYPE html>",
"<html lang=\"zh-CN\">",
"<!-- 英语就是en -->",
" <head>",
" <meta charset=\"UTF-8\">",
" <meta name=\"apple-mobile-web-app-capable\" content=\"yes\">",
" <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
" <meta name=\"keywords\" content=\"\" />",
" <meta name=\"author\" content=\"\">",
" <meta name=\"description\" content=\"\" />",
" <link rel=\"Shortcut Icon\" href=\"http://web.yunduanjianzhan.cn/images/logos/favicon.ico\" type=\"image/x-icon\" />",
" <link rel=\"stylesheet\" href=\"../static/css/index.css\">",
" <title>Hello World!</title>",
" </head>",
" <body>",
" ",
" ",
" <script src=\"../static/js/index.js\"></script>",
" </body>",
" </html>"
],
"description": ""
},
"简单输入框和按钮,并有点击事件,配置函数clickplace": {
"prefix": "",
"body": [
" <input type=\"text\" id=\"num\">",
" <button type=\"button\" onclick=\"clickreplace()\">点击这里</button>"
],
"description": ""
},
"普通按钮": {
"prefix": "b",
"body": [
" <button type=\"button\" onclick=\"\">点我!</button>"
],
"description": ""
},
"跳转链接按钮": {
"prefix": "b",
"body": [
" <button type=\"button\" onclick=\"window.location.href='http://home.yunduanjianzhan.cn'\">了解我</button>",
""
],
"description": ""
},
"固定时间后自动跳转网页": {
"prefix": "u",
"body": [
"<meta http-equiv=\"refresh\" content=\"5;http://he.yunduanjianzhan.cn/\">"
],
"description": ""
},
"ascii码文本图片": {
"prefix": "l",
"body": [
"// _ ",
"// | |__ ___ _ __ __ _ ",
"// | '_ \\ / _ \\ | '_ \\ / _` |",
"// | | | | | __/ | | | | | _| |",
"// |_| |_| \\___| |_| |_| \\__, |",
"// |___/ "
],
"description": ""
},
"外部引入css": {
"prefix": "c",
"body": [
" <link rel=\"stylesheet\" type=\"text/css\" href=\"\">"
],
"description": ""
},
"注释": {
"prefix": "h",
"body": [
"<!-- -->"
],
"description": ""
},
"p标签": {
"prefix": "p",
"body": [
"<p>",
"</p>",
],
"description": "<p></p>"
},
"h1标签": {
"prefix": "h",
"body": [
"<h1>",
"</h1>",
],
"description": "<h1></h1>"
},
"h2标签": {
"prefix": "h",
"body": [
"<h2>",
"</h2>",
],
"description": "<h2></h2>"
},
"h3标签": {
"prefix": "h",
"body": [
"<h3>",
"</h3>",
],
"description": "<h3></h3>"
},
"h4标签": {
"prefix": "h",
"body": [
"<h4>",
"</h4>",
],
"description": "<h4></h4>"
},
"头部": {
"prefix": "h",
"body": [
"<header></header>"
],
"description": ""
},
"尾部": {
"prefix": "f",
"body": [
"<footer></footer>"
],
"description": ""
},
"图片": {
"prefix": "i",
"body": [
"<img src=\"img.png\" width=\"\" height=\"\" alt=\"\" ismap> </a>"
],
"description": ""
},
"网页图标": {
"prefix": "i",
"body": [
"<link rel=\"icon\" type=\"来源:恒的站点图标\" href=\"http://hexo.yunduanjianzhan.cn/img/avatar.jpg\"/>",
],
"description": "网页图标"
},
"网页栏标题": {
"prefix": "t",
"body": [
"<title></title>"
],
"description": ""
},
"盒": {
"prefix": "d",
"body": [
" <div id=\"\"></div>",
],
"description": "盒"
},
"DNS预解析": {
"prefix": "d",
"body": [
" <link rel=\"dns-prefetch\" href=\"\">",
],
"description": "DNS预解析"
},
"设置网页的缓存策略": {
"prefix": "c",
"body": [
" <meta http-equiv=\"Cache-Control\" content=\"no-cache, no-store, must-revalidate\">",
" <meta http-equiv=\"Pragma\" content=\"no-cache\">",
" <meta http-equiv=\"Expires\" content=\"0\">"
],
"description": ""
},
"链接": {
"prefix": "a",
"body": [
"<a href=\"\" target=\"_blank\"></a>"
],
"description": ""
},
"分割线": {
"prefix": "h",
"body": [
"<hr>"
],
"description": ""
},
"无序排列": {
"prefix": "l",
"body": [
"<ul>",
" <li> </li>",
" <li> </li>",
" <li> </li>",
" <li> </li>",
"</ul>"
],
"description": ""
},
"有序排列": {
"prefix": "l",
"body": [
"<ol>",
" <li> </li>",
" <li> </li>",
" <li> </li>",
" <li> </li>",
"</ol>"
],
"description": ""
},
"说明表": {
"prefix": "b",
"body": [
"<dl>",
" <dt> 这是一份文件 </dt>",
" <dd> 这里是这份文件的详细内容 1 </dd>",
" <dd> 这里是这份文件的详细内容 2 </dd>",
"</dl>"
],
"description": ""
},
"添加主题切换按钮": {
"prefix": "t",
"body": [
" <button id=\"toggleTheme\">切换主题</button>"
],
"description": ""
},
"bootstrap 长框": {
"prefix": "b",
"body": [
"<div class=\"alert alert-danger\" role=\"alert\">",
" A simple danger alert—check it out!",
"</div>"
],
"description": ""
},
"bootstrap 按钮": {
"prefix": "b",
"body": [
"<button type=\"button\" class=\"btn btn-primary\" id=\"liveAlertBtn\">显示警告框(alert)</button>"
],
"description": ""
},
"bootstrap 文字容器": {
"prefix": "",
"body": [
"<div class=\"alert alert-success\" role=\"alert\"></div>"
],
"description": ""
},
"bootstrap 徽章": {
"prefix": "b",
"body": [
"<span class=\"badge text-bg-primary\">Primary</span>",
"<span class=\"badge text-bg-secondary\">Secondary</span>",
"<span class=\"badge text-bg-success\">Success</span>",
"<span class=\"badge text-bg-danger\">Danger</span>",
"<span class=\"badge text-bg-warning\">Warning</span>",
"<span class=\"badge text-bg-info\">Info</span>",
"<span class=\"badge text-bg-light\">Light</span>",
"<span class=\"badge text-bg-dark\">Dark</span>"
],
"description": ""
},
"bootstrap 按钮2": {
"prefix": "b",
"body": [
"<button type=\"button\" class=\"btn btn-outline-primary\">Primary</button>",
"<button type=\"button\" class=\"btn btn-outline-secondary\">Secondary</button>",
"<button type=\"button\" class=\"btn btn-outline-success\">Success</button>",
"<button type=\"button\" class=\"btn btn-outline-danger\">Danger</button>",
"<button type=\"button\" class=\"btn btn-outline-warning\">Warning</button>",
"<button type=\"button\" class=\"btn btn-outline-info\">Info</button>",
"<button type=\"button\" class=\"btn btn-outline-light\">Light</button>",
"<button type=\"button\" class=\"btn btn-outline-dark\">Dark</button>"
],
"description": ""
},
"bootstrap 按钮组": {
"prefix": "b",
"body": [
"<div class=\"btn-group\" role=\"group\" aria-label=\"Basic mixed styles example\">",
" <button type=\"button\" class=\"btn btn-danger\">Left</button>",
" <button type=\"button\" class=\"btn btn-warning\">Middle</button>",
" <button type=\"button\" class=\"btn btn-success\">Right</button>",
"</div>"
],
"description": ""
},
"bootstrap 卡片(含照片)": {
"prefix": "b",
"body": [
"<div class=\"card\" style=\"width: 18rem;\">",
" <img src=\"...\" class=\"card-img-top\" alt=\"...\">",
" <div class=\"card-body\">",
" <h5 class=\"card-title\">Card title</h5>",
" <p class=\"card-text\">Some quick example text to build on the card title and make up the bulk of the card's content.</p>",
" <a href=\"#\" class=\"btn btn-primary\">Go somewhere</a>",
" </div>",
"</div>"
],
"description": ""
},
"bootstrap 卡片组(含照片)": {
"prefix": "b",
"body": [
"<div class=\"row row-cols-1 row-cols-md-3 g-4\">",
" <div class=\"col\">",
" <div class=\"card\">",
" <img src=\"...\" class=\"card-img-top\" alt=\"...\">",
" <div class=\"card-body\">",
" <h5 class=\"card-title\">Card title</h5>",
" <p class=\"card-text\">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>",
" </div>",
" </div>",
" </div>",
" <div class=\"col\">",
" <div class=\"card\">",
" <img src=\"...\" class=\"card-img-top\" alt=\"...\">",
" <div class=\"card-body\">",
" <h5 class=\"card-title\">Card title</h5>",
" <p class=\"card-text\">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>",
" </div>",
" </div>",
" </div>",
" <div class=\"col\">",
" <div class=\"card\">",
" <img src=\"...\" class=\"card-img-top\" alt=\"...\">",
" <div class=\"card-body\">",
" <h5 class=\"card-title\">Card title</h5>",
" <p class=\"card-text\">This is a longer card with supporting text below as a natural lead-in to additional content.</p>",
" </div>",
" </div>",
" </div>",
" <div class=\"col\">",
" <div class=\"card\">",
" <img src=\"...\" class=\"card-img-top\" alt=\"...\">",
" <div class=\"card-body\">",
" <h5 class=\"card-title\">Card title</h5>",
" <p class=\"card-text\">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>",
" </div>",
" </div>",
" </div>",
"</div>"
],
"description": ""
},
"bootstrap 字幕手动轮播图": {
"prefix": "b",
"body": [
"<div id=\"carouselExampleFade\" class=\"carousel slide carousel-fade\">",
" <div class=\"carousel-inner\">",
" <div class=\"carousel-item active\">",
" <img src=\"...\" class=\"d-block w-100\" alt=\"...\">",
" </div>",
" <div class=\"carousel-item\">",
" <img src=\"...\" class=\"d-block w-100\" alt=\"...\">",
" </div>",
" <div class=\"carousel-item\">",
" <img src=\"...\" class=\"d-block w-100\" alt=\"...\">",
" </div>",
" </div>",
" <button class=\"carousel-control-prev\" type=\"button\" data-bs-target=\"#carouselExampleFade\" data-bs-slide=\"prev\">",
" <span class=\"carousel-control-prev-icon\" aria-hidden=\"true\"></span>",
" <span class=\"visually-hidden\">Previous</span>",
" </button>",
" <button class=\"carousel-control-next\" type=\"button\" data-bs-target=\"#carouselExampleFade\" data-bs-slide=\"next\">",
" <span class=\"carousel-control-next-icon\" aria-hidden=\"true\"></span>",
" <span class=\"visually-hidden\">Next</span>",
" </button>",
"</div>"
],
"description": ""
},
"bootstrop 折叠面板": {
"prefix": "b",
"body": [
"<p>",
" <button class=\"btn btn-primary\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapseWidthExample\" aria-expanded=\"false\" aria-controls=\"collapseWidthExample\">",
" Toggle width collapse",
" </button>",
"</p>",
"<div style=\"min-height: 120px;\">",
" <div class=\"collapse collapse-horizontal\" id=\"collapseWidthExample\">",
" <div class=\"card card-body\" style=\"width: 300px;\">",
" This is some placeholder content for a horizontal collapse. It's hidden by default and shown when triggered.",
" </div>",
" </div>",
"</div>"
],
"description": ""
},
"导航栏": {
"prefix": "b",
"body": [
"<nav class=\"navbar bg-dark\" data-bs-theme=\"dark\">",
" <!-- Navbar content -->",
"</nav>",
"",
"<nav class=\"navbar bg-primary\" data-bs-theme=\"dark\">",
" <!-- Navbar content -->",
"</nav>",
"",
"<nav class=\"navbar\" style=\"background-color: #e3f2fd;\">",
" <!-- Navbar content -->",
"</nav>"
],
"description": ""
},
"bootstarp 加载效果卡片(含照片)": {
"prefix": "",
"body": [
"<div class=\"card\">",
" <img src=\"...\" class=\"card-img-top\" alt=\"...\">",
"",
" <div class=\"card-body\">",
" <h5 class=\"card-title\">Card title</h5>",
" <p class=\"card-text\">Some quick example text to build on the card title and make up the bulk of the card's content.</p>",
" <a href=\"#\" class=\"btn btn-primary\">Go somewhere</a>",
" </div>",
"</div>",
"",
"<div class=\"card\" aria-hidden=\"true\">",
" <img src=\"...\" class=\"card-img-top\" alt=\"...\">",
" <div class=\"card-body\">",
" <h5 class=\"card-title placeholder-glow\">",
" <span class=\"placeholder col-6\"></span>",
" </h5>",
" <p class=\"card-text placeholder-glow\">",
" <span class=\"placeholder col-7\"></span>",
" <span class=\"placeholder col-4\"></span>",
" <span class=\"placeholder col-4\"></span>",
" <span class=\"placeholder col-6\"></span>",
" <span class=\"placeholder col-8\"></span>",
" </p>",
" <a href=\"#\" tabindex=\"-1\" class=\"btn btn-primary disabled placeholder col-6\"></a>",
" </div>",
"</div>"
],
"description": ""
},
"bootstrap 加载效果": {
"prefix": "b",
"body": [
"<div class=\"spinner-grow\" role=\"status\">",
" <span class=\"visually-hidden\">Loading...</span>",
"</div>"
],
"description": ""
},
"bootstrap 引入css": {
"prefix": "b",
"body": [
" <link href=\"https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css\" rel=\"stylesheet\" integrity=\"sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD\" crossorigin=\"anonymous\">"
],
"description": ""
},
"bootstrap 引入js": {
"prefix": "b",
"body": [
"<script src=\"https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js\" integrity=\"sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3\" crossorigin=\"anonymous\"></script>",
"<script src=\"https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js\" integrity=\"sha384-ep+dxp/oz2RKF89ALMPGc7Z89QFa32C8Uv1A3TcEK8sMzXVysblLA3+eJWTzPJzT\" crossorigin=\"anonymous\"></script>"
],
"description": ""
}
}
css.json
// Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and
// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope
// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is
// used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders.
// Placeholders with the same ids are connected.
// Example:
// "Print to console": {
// "scope": "javascript,typescript",
// "prefix": "log",
// "body": [
// "console.log('$1');",
// "$2"
// ],
// "description": "Log output to console"
// }
{
"注释": {
"prefix": "c",
"body": [
"/*------------------------------------*\\",
" $CONTENTS",
"\\*------------------------------------*/",
""
],
"description": ""
},
"完整展示图片": {
"prefix": "i",
"body": [
"img {",
" max-width: 100%;",
"}",
""
],
"description": ""
},
"使用import": {
"prefix": "i",
"body": [
"@import url(phone.css) screen and (min-width: 320px) and (max-width: 480px);"
],
"description": ""
},
"css注释": {
"prefix": "h",
"body": [
"/* */"
],
"description": ""
},
"多列布局column": {
"prefix": "",
"body": [
"",
"main {",
" /*column-width: 12em; css3多列布局:固定列宽 */",
" column-count: 10;/* css3多列布局:固定列数 */",
" column-gap: 1em;/* css3多列布局:列间距 */",
" column-fill: balance;/* css3多列布局 */",
" column-rule: 1px solid #da5757;/* css3多列布局:分割线 */",
" column-rule-color: #962b2b;/* css3多列布局: 分割线颜色 */",
" column-rule-style: dotted;/* css3多列布局 : 分割线样式 */",
" column-rule-width: 4px;/* css3多列布局 : 分割线宽度 */",
"}",
""
],
"description": ""
},
"媒体查询:根据像素大小分配样式": {
"prefix": "m",
"body": [
"",
"@media screen and (max-width: 550px) {",
" body{",
" background-color: blue;",
" }",
" ",
"}",
""
],
"description": ""
},
"快速定义盒子大小": {
"prefix": "d",
"body": [
"div { padding: 10px 10px 10px 10px;margin: 10px 10px 10px 10px;",
"}"
],
"description": ""
},
"css全覆盖背景范式": {
"prefix": "b",
"body": [
"body { ",
"background-image: url(); ",
"background-repeat: no-repeat;",
"background-size:cover;",
"background-position:;",
"background-attachment:;",
"background-origin:;",
"}"
],
"description": ""
},
"添加主题切换按钮": {
"prefix": "t",
"body": [
" body {",
" font-family: Arial, sans-serif;",
" transition: background-color 0.5s;",
" }",
"",
" .light-theme {",
" background-color: white;",
" color: black;",
" }",
"",
" .dark-theme {",
" background-color: black;",
" color: white;",
" }",
"",
" button {",
" margin: 10px;",
" }"
],
"description": ""
},
"文字静态跟随鼠标": {
"prefix": "m",
"body": [
"#followingText {",
" position: absolute;",
" font-size: 24px;",
" pointer-events: none;",
"}"
],
"description": ""
},
"按钮class=custom-btn btn-6": {
"prefix": "w",
"body": [
".btn-6 {",
" background: rgb(247,150,192);",
" background: radial-gradient(circle, rgba(247,150,192,1) 0%, rgba(118,174,241,1) 100%);",
" line-height: 42px;",
" padding: 0;",
" border: none;",
" }",
" .btn-6 span {",
" position: relative;",
" display: block;",
" width: 100%;",
" height: 100%;",
" }",
" .btn-6:before,",
" .btn-6:after {",
" position: absolute;",
" content: \"\";",
" height: 0%;",
" width: 1px;",
" box-shadow:",
" -1px -1px 20px 0px rgba(255,255,255,1),",
" -4px -4px 5px 0px rgba(255,255,255,1),",
" 7px 7px 20px 0px rgba(0,0,0,.4),",
" 4px 4px 5px 0px rgba(0,0,0,.3);",
" }",
" .btn-6:before {",
" right: 0;",
" top: 0;",
" transition: all 500ms ease;",
" }",
" .btn-6:after {",
" left: 0;",
" bottom: 0;",
" transition: all 500ms ease;",
" }",
" .btn-6:hover{",
" background: transparent;",
" color: #76aef1;",
" box-shadow: none;",
" }",
" .btn-6:hover:before {",
" transition: all 500ms ease;",
" height: 100%;",
" }",
" .btn-6:hover:after {",
" transition: all 500ms ease;",
" height: 100%;",
" }",
" .btn-6 span:before,",
" .btn-6 span:after {",
" position: absolute;",
" content: \"\";",
" box-shadow:",
" -1px -1px 20px 0px rgba(255,255,255,1),",
" -4px -4px 5px 0px rgba(255,255,255,1),",
" 7px 7px 20px 0px rgba(0,0,0,.4),",
" 4px 4px 5px 0px rgba(0,0,0,.3);",
" }",
" .btn-6 span:before {",
" left: 0;",
" top: 0;",
" width: 0%;",
" height: .5px;",
" transition: all 500ms ease;",
" }",
" .btn-6 span:after {",
" right: 0;",
" bottom: 0;",
" width: 0%;",
" height: .5px;",
" transition: all 500ms ease;",
" }",
" .btn-6 span:hover:before {",
" width: 100%;",
" }",
" .btn-6 span:hover:after {",
" width: 100%;",
" }",
" ",
"",
" .custom-btn {",
" width: 130px;",
" height: 40px;",
" color: #177f83;",
" border-radius: 5px;",
" padding: 5px 25px;",
" font-family: 'Lato', sans-serif;",
" font-weight: 5000;",
" background: transparent;",
" cursor: pointer;",
" transition: all 0.3s ease;",
" position: relative;",
" display: inline-block;",
" box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5),",
" 7px 7px 20px 0px rgba(0,0,0,.1),",
" 4px 4px 5px 0px rgba(0,0,0,.1);",
" outline: none;",
" }",
""
],
"description": ""
}
}
javascript.json
{
// Place your snippets for javascript here. Each snippet is defined under a snippet name and has a prefix, body and
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
// same ids are connected.
// Example:
// "Print to console": {
// "prefix": "log",
// "body": [
// "console.log('$1');",
// "$2"
// ],
// "description": "Log output to console"
"注明原创": {
"prefix": "l",
"body": [
"console.log(\"作者:小恒不会java\")",
"console.log(\"欢迎查看源代码!\")",
""
],
"description": ""
},
"打印控制台日记": {
"prefix": "c",
"body": [
"console.log(\"\")",
"",
""
],
"description": ""
},
"基本函数模板": {
"prefix": "f",
"body": [
"function myFunction() {",
" ",
"}"
],
"description": ""
},
"防止右键菜单,F12,复制粘贴": {
"prefix": "f12",
"body": [
" // 禁用右键菜单",
" document.addEventListener('contextmenu', function (e) {",
" e.preventDefault();",
" alert('右键菜单已禁用');",
" });",
"",
" // 禁用F12键",
" document.addEventListener('keydown', function (e) {",
" if (e.key === 'F12') {",
" e.preventDefault();",
" alert('F12已禁用');",
" }",
" });",
"",
" // 禁用复制和粘贴",
" document.addEventListener('copy', function (e) {",
" e.preventDefault();",
" alert('复制粘贴功能已禁用');",
" });",
"",
" document.addEventListener('paste', function (e) {",
" e.preventDefault();",
" alert('复制粘贴功能已禁用');",
" });",
""
],
"description": ""
},
"直接写入html输出流": {
"prefix": "d",
"body": [
"document.write(\"\");"
],
"description": ""
},
"js定义函数clickreplace,用于判断输入框内是否是数字": {
"prefix": "",
"body": [
"function clickreplace()",
"{",
" var x=document.getElementById(\"num\").value;",
" if(x==\"\"||isNaN(x))",
" {",
" alert(\"不是数字\");",
" }",
"",
"} "
],
"description": ""
},
"显示当前实时时间": {
"prefix": "t",
"body": [
"const timeElement = document.getElementById('time');",
"",
"function updateTime() {",
" const now = new Date();",
" const year = now.getFullYear();",
" const month = now.getMonth() + 1;",
" const day = now.getDate();",
" const hours = now.getHours();",
" const minutes = now.getMinutes();",
" const seconds = now.getSeconds();",
"",
" timeElement.textContent = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;",
"}",
"",
"setInterval(updateTime, 1000); // 每秒更新一次时间"
],
"description": ""
},
"根据时间段出现的问候语": {
"prefix": "g",
"body": [
"const greetingElement = document.getElementById('greeting');",
"",
"function updateGreeting() {",
" const now = new Date();",
" const hours = now.getHours();",
" let greeting;",
"",
" if (hours >= 5 && hours < 7) {",
" greeting = '早上好!一天开始了,祝你有个美好的一天!';",
" } else if (hours >= 7 && hours < 10) {",
" greeting = '上午好!工作顺利,精神抖擞!';",
" } else if (hours >= 10 && hours < 12) {",
" greeting = '中午好!休息一下,吃顿美味的午餐吧!';",
" } else if (hours >= 12 && hours < 14) {",
" greeting = '下午好!休息好了,继续努力工作吧!';",
" } else if (hours >= 14 && hours < 18) {",
" greeting = '傍晚好!累了一天,愿你晚上能好好放松!';",
" } else if (hours >= 18 && hours < 20) {",
" greeting = '晚上好!享受美食,放松心情,准备迎接新的一天吧!';",
" } else if (hours >= 20 && hours < 22) {",
" greeting = '晚安!今天过得怎么样?希望你有个美好的夜晚!';",
" } else {",
" greeting = '夜深了,愿你拥有一个美好的梦乡!';",
" }",
"",
" greetingElement.textContent = greeting;",
"}",
"",
"updateGreeting();"
],
"description": ""
},
"添加主题切换按钮": {
"prefix": "t",
"body": [
"updateGreeting();",
"",
"const toggleThemeButton = document.getElementById('toggleTheme');",
"const bodyElement = document.body;",
"",
"toggleThemeButton.addEventListener('click', () => {",
" if (bodyElement.classList.contains('light-theme')) {",
" bodyElement.classList.remove('light-theme');",
" bodyElement.classList.add('dark-theme');",
" } else {",
" bodyElement.classList.remove('dark-theme');",
" bodyElement.classList.add('light-theme');",
" }",
"});"
],
"description": ""
},
"静态文本跟随鼠标": {
"prefix": "",
"body": [
" const followingTextElement = document.getElementById('followingText');",
"",
" function updateTextPosition(event) {",
" followingTextElement.style.left = event.clientX + 'px';",
" followingTextElement.style.top = event.clientY + 'px';",
" }",
"",
" document.addEventListener('mousemove', updateTextPosition);"
],
"description": ""
},
"浏览器的内置alert()函数实现的弹窗": {
"prefix": "w",
"body": [
"function showPopup() {",
" alert(\"欢迎访问我们的网站!\");",
"}",
"",
"window.addEventListener(\"load\", showPopup);"
],
"description": ""
},
"模态对话框js逻辑": {
"prefix": "w",
"body": [
" function showPopup() {",
" const modal = document.getElementById(\"myModal\");",
" modal.style.display = \"block\";",
"",
" const span = document.getElementsByClassName(\"close\")[0];",
" span.onclick = function() {",
" modal.style.display = \"none\";",
" }",
"",
" window.onclick = function(event) {",
" if (event.target == modal) {",
" modal.style.display = \"none\";",
" }",
" }",
" }",
"",
" window.addEventListener(\"load\", showPopup);"
],
"description": ""
},
"打字特效": {
"prefix": "w",
"body": [
" const text = \"欢迎访问我们的网站!\";",
" let index = 0;",
"",
" function typeWriter() {",
" if (index< text.length) {",
" document.getElementById(\"typedText\").innerHTML += text.charAt(index);",
" index++;",
" setTimeout(typeWriter, 100);",
" }",
" }",
"",
" window.addEventListener(\"load\", typeWriter);"
],
"description": ""
}
}
python.json
// Place your snippets for python here. Each snippet is defined under a snippet name and has a prefix, body and
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
// same ids are connected.
// Example:
// "Print to console": {
// "prefix": "log",
// "body": [
// "console.log('$1');",
// "$2"
// ],
// "description": "Log output to console"
// }
{
"if-else模板": {
"prefix": "i",
"body": [
"if :",
" ",
"else:",
],
"description": "if-else 模板"
},
"设置utf-8编码": {
"prefix": "u",
"body": [
"# -*- coding: utf-8 -*-"
],
"description": ""
},
"注释": {
"prefix": "p",
"body": [
"# "
],
"description": ""
},
"注明": {
"prefix": "l",
"body": [
"#作者:小恒不会java",
"#时间:2024年3月1日",
"#微信:a13551458597",
""
],
"description": ""
},
"计时器修饰": {
"prefix": "t",
"body": [
"import time",
"from functools import wraps",
"",
"def timer_decorator(func):",
" @wraps(func)",
" def wrapper(*args, **kwargs):",
" start_time = time.time()",
" result = func(*args, **kwargs)",
" end_time = time.time()",
" print(f\"{func.__name__} 运行时间是 {end_time - start_time:.2f} .\")",
" return result",
" return wrapper"
],
"description": ""
},
"空格": {
"prefix": "e",
"body": [
"= "
],
"description": ""
},
"点明程序入口": {
"prefix": "i",
"body": [
"if __name__==\"__main__:",
],
"description": ""
},
"form格式导入": {
"prefix": "f",
"body": [
"from import "
],
"description": ""
},
"wxauto导入": {
"prefix": "wx",
"body": [
"from wxauto import WeChat",
"",
"wx = WeChat()"
],
"description": ""
},
"utf-8 settings": {
"prefix": "utf",
"body": [
"#coding=utf-8"
],
"description": ""
},
"整型输入": {
"prefix": "i",
"body": [
"x = int(input())"
],
"description": ""
},
"for函数": {
"prefix": "f",
"body": [
"for i in range():"
],
"description": ""
},
"flask登录基本模板": {
"prefix": "f",
"body": [
"from flask import Flask, render_template, request, redirect, url_for, session",
"",
"app = Flask(__name__)",
"",
"# 设置应用的秘钥,用于加密 session 数据",
"app.secret_key = 'lihengiszhongnan'",
"",
"# 假设这是您的用户数据存储",
"users = {",
" \"liheng\": \"13551458597a\",",
" \"user\": \"testuser\",",
"}",
"",
"@app.route('/')",
"def index():",
" return render_template('login.html')",
"",
"@app.route('/login', methods=['GET', 'POST'])",
"def login():",
" if request.method == 'POST':",
" username = request.form['username']",
" password = request.form['password']",
"",
" if username in users and users[username] == password:",
" # 将用户名存储在 session 中",
" session['username'] = username",
" return redirect(url_for('profile', username=username))",
" else:",
" return \"抱歉:用户名或密码错误\"",
"",
" return render_template('login.html')",
"",
"@app.route('/profile/<username>')",
"def profile(username):",
" # 检查用户是否已登录",
" if 'username' not in session or session['username'] != username:",
" # 如果用户未登录,重定向用户回登录页面",
" return redirect(url_for('login', next=request.url))",
"",
" return render_template('profile.html', username=username)",
"",
"if __name__ == '__main__':",
" app.run(debug=True)"
],
"description": ""
},
"flask导入": {
"prefix": "f",
"body": [
"from flask import Flask"
],
"description": ""
},
"flask入口": {
"prefix": "f",
"body": [
"app = Flask(__name__)"
],
"description": ""
},
"路由": {
"prefix": "f",
"body": [
"@app.route('/index')",
"def hello_world():",
" return render_template('index.html') # 需要引入render_template"
],
"description": ""
},
"检查当前模块是否作为主程序运行": {
"prefix": "f",
"body": [
"if __name__ == '__main__':",
" app.run(debug=True)"
],
"description": ""
},
"django文本请求": {
"prefix": "d",
"body": [
"def index(request):",
" return HttpResponse(\"Hello, World!\")"
],
"description": ""
}
}