|
|
@@ -0,0 +1,73 @@
|
|
|
+<!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>
|
|
|
+ .box{
|
|
|
+ color: red;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+ <ul>
|
|
|
+
|
|
|
+ </ul>
|
|
|
+ <button>添加</button>
|
|
|
+ <script>
|
|
|
+ // let ul = document.querySelector("ul");
|
|
|
+ // let btn = document.querySelector("button");
|
|
|
+
|
|
|
+ // var i = 1;
|
|
|
+ // btn.onclick = function(){
|
|
|
+ // // ul.innerHTML += "<li class='box'>"+(i++)+"</li>";
|
|
|
+
|
|
|
+ // ul.innerHTML += `<li class="box">${i++}</li>`
|
|
|
+ // }
|
|
|
+
|
|
|
+ // 模版字符串
|
|
|
+ // 定义方式为：``
|
|
|
+ // 1、模版字符串内可以任意使用引号
|
|
|
+ // 2、模版字符串内可以换行
|
|
|
+ // 3、模版字符串内可以使用变量 ${变量}
|
|
|
+
|
|
|
+ // includes 判断字符串中是否办函子串
|
|
|
+ // let str = "hello";
|
|
|
+ // console.log(str.includes("e"));
|
|
|
+
|
|
|
+ // startsWidth 判断字符串是否以指定的子串为开头
|
|
|
+ // let str = "hello";
|
|
|
+ // console.log(str.startsWith("e"));
|
|
|
+
|
|
|
+ // endsWidth 判断字符串是否以指定的子串为结尾
|
|
|
+ // let str = "hello";
|
|
|
+ // console.log(str.endsWith("o"));
|
|
|
+
|
|
|
+ // repeat 字符串重复指定次数
|
|
|
+ // let str = "hello";
|
|
|
+ // console.log(str.repeat(3));
|
|
|
+
|
|
|
+ // padStart 以指定的字符开头扩展字符串
|
|
|
+ // let str = "hello";
|
|
|
+ // console.log(str.padStart(10,"x"));
|
|
|
+
|
|
|
+ // padEnd 以指定的字符结尾扩展字符串
|
|
|
+ // let str = "hello";
|
|
|
+ // console.log(str.padEnd(10,"x"));
|
|
|
+
|
|
|
+ // trim() 去掉字符串首尾的空格
|
|
|
+ // trimStart()去除开头的空格
|
|
|
+ // let str = " hello";
|
|
|
+ // console.log(str.trimStart());
|
|
|
+
|
|
|
+ // trimEnd()去除结尾空格
|
|
|
+ // let str = "hello ";
|
|
|
+ // console.log(str.trimEnd());
|
|
|
+
|
|
|
+ // at()获取指定位置的字符
|
|
|
+ // let str = "hello";
|
|
|
+ // console.log(str.at(0));
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+</html>
|
