需要注意不同分支之间的关系，不要随意合并。
使用频率较高的Git命令：
$ git 添加到暂存区
$ git commit -m"（记录使用的注释）" 把文件提交到仓库
$ git status 查看是否还有文件没有提交
$ git log 查看历史记录
$ 删除文件
$ git push origin master 推送文件到Gitlab
$ git remote -v 查看是否连接Gitlab仓库
部分重要常用标签：
<img src="(目标图片的路径)" alt="(替换文本)" title="(提示文本/鼠标悬停时显示的文本)">
图片标签的width和height属性
属性名：width和height
属性值：宽度和高度（数字）
注意点：
• 如果只设置width或height中的一个，另一个没设置的会自动等比例缩放（此时图片不会变形）
• 如果同时设置了width和height两个，若设置不当此时图片可能会变形
总结：
| 属性 | 说明 |
|---|---|
| src | 指定需要展示图片的路径 |
| alt | 替换文本，当图片加载失败时，才显示的文字 |
| title | 提示文本，当鼠标悬停时，才显示的文字 |
| width | 图片的宽度 |
| height | 图片的高度 |
路径小结
相对路径有哪三种情况：
• 同级目录：直接写：目标文件名字！
• 下级目录：直接写：文件夹名/目标文件名字！
• 上级目录：直接下：…/目标文件名字！
VSCode中路径的快捷操作？
• 同级和下级目录：./ 之后选择即可
• 上级目录：…/ 之后选择即可
代码
<audio src="music.mp3" controls></audio>
示例
<body><img src="img/1.jpg" alt="" title="音乐"><audio src="./music.mp3" controls></audio>
</body>
常见属性：
| 属性名 | 功能 |
|---|---|
| src | 音频的路径 |
| controls | 显示播放的控件 |
| autoplay | 自动播放 |
| loop | 循环播放 |
注意
代码
<video src="./video.mp4" controls></video>
示例
<body><img src="img/1.jpg" alt="" title="视频"><audio src="./music.mp3" controls></audio><video src="./video.mp4" controls></video>
</body>
常见属性：
| 属性名 | 功能 |
|---|---|
| src | 视频的路径 |
| controls | 显示播放的的控件 |
| autopsy | 自动播放（谷歌浏览器中需配合muted实现静音播放） |
| loop | 循环播放 |
代码
<a href="./目标网页.html">超链接</a>
显示特点
• a标签默认文字有下划线
• a标签从未点击过，默认文字显示蓝色
• a标签点击过之后，文字显示为紫色（清除浏览器历史记录可恢复蓝色）
属性名：target
| 取值 | 效果 |
|---|---|
| _self | 默认值，在当前窗口中跳转（覆盖当前网页） |
| _blank | 在新的窗口中跳转（保留原网页） |
示例
<a href="/" target="_blank">百度一下</a>
后代选择器
选择器之间用空格隔开
作用： 由嵌套关系，在根据选择器1所找到的标签的后代中，找到满足选择器2的标签，设置样式
示例：
p .color{color:red;
}
子代选择器
选择器之间用>隔开
作用： 由嵌套关系，在根据选择器1找到的子代中，找到满足选择器2的标签，设置样式
p>.color{color:red;
}
在HTML显示为：
<body><div id="id">id选择器</div>
</body>
css样式：
#id{color: red;
}
在HTML显示为：
<body><div id="class选择器"></div>
</body>
css样式：
.class{color: blue;
}
<head><script>function myFunction(){ElementById("demo").innerHTML="我的第一个JavaScript";}</script>
</head>
<body><h1>我的web页面</h1><p id="demo">会变化</p><button type="button" οnclick="myFunction()">尝试一下</button>
</body>
<!DOCTYPE html>
<html>
<body>
<h1>我的 Web 页面</h1>
<p id="demo">一个段落</p>
<button type="button" onclick="myFunction()">尝试一下</button>
<script>
function myFunction()
{ElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<body>
<script src="myScript.js"></script>
</body>
</html>
外部标签不能包含script标签
1、在标签中填写onclick事件调用函数时，不是οnclick=函数名，而是οnclick=函数名+（）
<haed><script>function myfunction(){ElementById("demo").innerHTML="onclick事件触发"；}</script>
</haed>
<body><h1 id="demo">一个段落</h1><button onclick="myfunction()" type=button>点击这里</button>
</body>
弹出警告窗显示数据：
<script>
window,alert(5+6);
</script>
从JavaScript访问某个HTML元素，可以使用ElementById（id）方法
使用”id“属性来标识HTML元素，并innerHTML来获取或插入元素内容
<body><h1>我的标签</h1><p id="demo">我的段落</p><script&ElementById("demo").innerHTML = "段落已修改";</script>
</body>
使用console.log（）方法控制台输出
<script>
a = 5;
b = 6;
c = a + b;console.log(c);
</script>
布尔（逻辑）只能有两个值：true或false。
var x=true;
var y=false;
下面的代码创建名为cars的数组：
var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";
或者（condensed array）：
var cars=new Array("Saab","Volvo","BMW");
或者（literal array）：
var cars=["Saab","Volvo","BMW"];
数组下标是基本于零的，所以第一个项目是[0]，第二个是[1]，以此类推。
函数就是包裹在花括号里的代码块，使用关键词function：
function functionname(){//需要执行的代码
}
当调用函数时，会执行函数内的代码。
可以在某事件发生的时候直接调用函数（比如用户点击按钮时），并且可由JavaScript在任意位置调用。
JavaScript对大小写敏感。关键词function必须是小写的，并且必须以与函数名称相同的大小写来调用函数。
在调用函数时时，可以在里面传值，这些值被称为参数。
这些参数可以在函数里使用。
可以发送多个参数，使用，分隔：
myFunction(argument1,argument2)
当声明函数时，把函数当作变量来声明：
function myFunction(var1,var2){//执行的代码
}
变量和参数必须以一致的顺序出现，第一个变量就是第一个被传递的参数给定的值，以此类推。
<button onclick= 'myFunction("a","b")'>点击这里</button>
<script>function myFunction(name,job){alert("welcome" + a + "and" + b);
}
</script>
变量在函数内声明，变量为局部变量，具有局部作用域。
局部变量：只能在函数内部访问。
<p>局部变量在声明的函数外不可以访问。</p>
<p id="demo"></p>
<script>
myFunction();
ElementById("demo").innerHTML = "carName 的类型是：" + typeof carName;//此处不能调用carName变量
function myFunction()
{var carName = "Volvo";//函数内可以调用carName变量
}
</script>
局部变量只作用于函数内，所以不同的函数可以使用相同名称的变量。局部变量在函数开始执行时创建，函数执行完成后局部变量会自动销毁。
变量在函数外定义，即为全局变量。
全局变量有全局作用域：网页中所有脚本和函数均可使用。
var carName = "Volvo";
//此处可调用carName变量
function myFunction(){//函数内可调用carName变量
}
如果变量在函数中没有声明（没有使用var关键字），该变量为全局变量。
以下实例中carName在函数内，但是为全局变量。
//此处可调用carName变量
function myFunction（）{carName = "Volvo";//此处可调用carName变量
}
JavaScript变量的生命周期在它声明时初始化。局部变量在函数执行完毕后销毁。全局变量在页面关闭后销毁。
函数参数只在函数内起作用，是局部变量。在HTML中，全局变量是window对象；所有数据变量都属于window对象。
<p>
在 HTML 中, 所有全局变量都会成为 window 变量。
</p>
<p id="demo"></p>
<script>
myFunction();
ElementById("demo").innerHTML ="我可以显示 " + window.carName;
function myFunction()
{carName = "Volvo";
}
</script>
使用for循环：
cars=["BMW","Volvo","Saab","Ford"];
for (var i=0;i<cars.length;i++){document.write(cars[i] + "<br>");
}
JavaScript支持不同类型的循环：
for -循环代码块一定的次数
for/in -循环遍历对象的属性
while -当指定的条件为ture时循环指定的代码块
do/while -同样当指定的条件为ture时循环指定的代码块
for循环语句是创建循环时常会用到的工具。
for循环语法：
for （语句1；语句2；语句3）
{*被执行的代码块*
}
语句1：（代码块）开始前执行
语句2：定义运行循环（代码块）的条件
语句3：在循环（代码块）已被执行之后执行
for (var i = 0; i<5; i++){x=x + "该数字为" + i "<br>";}
声明1：在循环开始之前设置变量（var i=0）.
声明2：定义循环运行的条件（i必须小于5）.
声明3：在每次代码块已被执行后增加一个值（i++）。
**语句1：**会使用语句 1 初始化循环中所用的变量 (var i=0)。
语句 1 是可选的，也就是说不使用语句 1 也可以。
可以在语句 1 中初始化任意（或者多个）值：
cars=["BMW","Volvo","Saab","Ford"];
for (var i=0,l=cars.length; i<l; i++){document.write(cars[i] + "<br>");
}
或者省略语句1（比如在循环开始前已经设置了值时）
cars=["BMW","Volvo","Saab","Ford"];
var i=2,len=cars.length;
for (; i<len; i++){document.write(cars[i] + "<br>");
}
**语句2：**用于评估初始变量的条件。
同样是可选的。
如果语句 2 返回 true，则循环再次开始，如果返回 false，则循环将结束。
如果省略了语句 2，那么必须在循环内提供 break。否则循环就无法停下来。
**语句3：**通常语句 3 会增加初始变量的值。
语句 3 也是可选的。
语句 3 有多种用法。增量可以是负数 (i–)，或者更大 (i=i+15)。
语句 3 也可以省略（比如当循环内部有相应的代码时）：
cars=["BMW","Volvo","Saab","Ford"];
var i=0,len=cars.length;
for (; i<len; ){document.write(cars[i] + "<br>");i++;
}
<button οnclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){var x;var txt="";var person={fname:"Bill",lname:"Gates",age:56}; for (x in person){txt=txt + person[x];}ElementById("demo").innerHTML=txt;
}
</script>
for(//外层的初始变量；外层的条件表达式；外层的操作表达式){for(//里层的初始变量；里层的条件表达式；里层的操作表达式){//执行语句；}}
while循环会在指定条件为真的时候循环执行的代码块。
语法：
while （条件）｛
//执行代码
｝
示例：
var i = 1;
while (i <= 100){console.log('这个人已经'+i+'岁了');i++;
}//输出1-100岁
var message = prompt('你爱我吗');
while(message !== '我爱你'){message = prompt('你爱我吗？')}
console.log('嘻嘻😄');//弹出一个提示框，你爱我吗？如果输入我爱你，就提示结束，否则，一直询问。
do/while 循环是 while 循环的变体。该循环会在检查条件是否为真之前执行一次代码块，然后如果条件为真的话，就会重复这个循环。
与while循环不一样的是，do while循环是先执行再判断。该循环至少会执行一次，即使条件为 false 它也会执行一次，因为代码块会在条件被测试前执行
示例：
var i = 1
do {console.log('这个人已经 '+i+'岁');i++
}while(i <= 100)//输出人的年龄
do {var message = prompt('你爱我吗');}while(message !== '我爱你')
console.log(123);//弹出一个提示框，你爱我吗？如果输入我爱你，就提示结束，否则，一直询问。
扩展：
4 种循环的适用场景:
break 语句用于跳出循环。
continue 用于跳过循环中的一个迭代。
break语句
break 语句可用于跳出循环。
break 语句跳出循环后，会继续执行该循环之后的代码
示例：
for (var i = 1 ; i <= 5 ; i++){if(i == 3){break// 遇到break直接退出整个循环}console.log('这是第 '+i+'个');
}
continue语句
continue 语句中断当前的循环中的迭代，然后继续循环下一个迭代
//1.求1-100之间，除了能被7整除之外的整数和
for (var i = 1,sum = 0; i <= 100; i++){if ( i % 7 == 0){continue;}sum += i}
console.log('结果是 '+sum);
JavaScript变量可以转换为新变量或者其他数据类型：
示例：
//1.把数字型转化为字符串型 变量.toString（）
var num = 10, str = String();
console.log(str);
console.log(typeof str);
//2.利用String（变量）
console.log(String(num));//3.利用 + 拼接字符串的方法实现转换效果 隐式转换console.log(num + '');| 方式 | 说明 | 案例 |
|---|---|---|
| toSting（） | 转成字符串 | var num = 1;Sting()); |
| Sting（）强制转换 | 转成字符串 | var num = 1;alert(String(num)); |
| 加号拼接字符串 | 和字符串拼接的结果都是字符串 | var num = 1;alert(num + “字符串”); |
转换成数字型
| 方式 | 说明 | 案例 |
|---|---|---|
| parseInt（string）函数 | 将string类型转成整数数值型 | parseInt(‘78’) |
| parseFloat(string)函数 | 将string类型转成浮点数数值型 | parseFlora（‘78.12’） |
| Number()强制转换函数 | 将string类型转成数值型 | Number(‘12’) |
| js隐式转换（- * /） | 利用算术运算隐式转换为数值型 | ‘12’ - 0 |
//1.parseInt（变量）可以把字符型的转换为数字型 得到是整数
var age = prompt('输入年龄')
console.log(parseInt(age));
console.log(parseInt('3.14'));// 输出3 取整数
console.log(parseInt('120px'));//会去掉px单位 //2.parseFloat（变量）可以把字符型的转换为数字型 得到的是小数 浮点数
console.log(parseFloat('3.41'));
console.log(parseFloat('120px'));//同样可以去px单位
console.log(parseFloat('max120px'));//输出NaN 因为不是数字开头//3.利用Number（变量）转换
var str = '123'
console.log(Number(str));
console.log(Number('120'));//输出120//4.利用了算术运算 - * / 隐式转换
console.log('12' - 0);//输出12
console.log('156' * 2);
案例1：
//弹出一个输入框，我们输入出生年份后，能计算出我们的年龄
var age = prompt('请输入你的出生年份')
alert('您的年龄是' + ('2022'- age) + ' 岁')
console.log('用户的年龄是' + ('2022'- age) + ' 岁', '用户输入年龄是' + age );
案例2：
//简单加法案例
var num1 = prompt('1'),num2 = prompt('2')
alert(Number(num1)+Number(num2))//Number方式转换
转换为布尔型
| 方式 | 说明 | 案例 |
|---|---|---|
| Boolearn（）函数 | 其他类型转成布尔值 | Boolean（‘true’）; |
console.log(Boolean( ’ ’ ) ); //true
console.log(Boolean( ’ 小白 ’ ) ); //true
console.log(Boolean( 12 ) ); //true
console.log(Boolean( 0 ) ); //false
console.log(Boolean( NaN) ); //false
console.log(Boolean( null) ); //false
console.log(Boolean( undefined ) ); //false
语法结构：
if(条件表达式){//执行语句
}
如果if里面的条件表达式结果为真true 则执行大括号里面的 执行语句。反之则不执行里面的，执行外面的代码。
示例：
var age = prompt("请输入你的年龄")
if(age <= 18){alert("给爷爬！")
}
else{alert("欢迎来到王者荣耀！")
}
案例一：判断闰年
var year = prompt("请输入年份")
if ( year % 4 == 0){alert("这"+year+"年是闰年")
}
else{alert("这"+year+"年不是闰年")
}
案例二：判断成绩
//if多分支语句 判断成绩
var num = prompt("请输入成绩")
if(num >=90){alert('你的评价是 优秀！ ')
}
else if (num >=75){alert('你的成绩是 良好！ ')
}
else if (num >=60){alert('你的成绩是 及格！')
}
else if (num <=59){alert('扑街！退学吧！！')
}
语法结构：
条件表达式 ？ 表达式1 ： 表达式2
如果条件表达式结果为真 则返回表达式1的值 如果条件表达式结果为假 则返回表达式2的值
示例：
var num = 8
var result = num >2 ? '对的' : '不对'
console.log(result);//输出‘对的’
语法结构
switch（表达式）｛case value1;执行语句1;//表达式 等于 value1时要执行的代码break;case value2;执行语句2;//表达式 等于 value2时要执行的代码break;...default:执行最后的语句;//表达式 不等于任何一个value时要执行的代码
｝
利用我们的表达式的值 和 case 后面的选项值相匹配 如果匹配上，就执行该case里面的语句 如果都没有匹配上，那么执行 default里面的语句
Typescript需要先把ts文件通过tsc 1.ts命令转换成js文件。然后再使用node 1.js在终端打开。(可以直接使用ts-node 1.ts 省略生成js文件再打开的步骤)
任意值是TypeScript针对编程时类型不明确的变量使用的一种数据类型，它常用于以下三种情况。
1.变量的值会动态改变时，比如来自用户的输入，任意值类型可以让这些变量跳过编译阶段的类型检查，如：
let x: any = 1; //数字类型
x = 'I am who I am'; //字符串类型
x = flase; //布尔类型
本文发布于:2024-02-01 15:33:06，感谢您对本站的认可！
本文链接：https://www.4u4v.net/it/170677278537609.html
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。
| 留言与评论（共有 0 条评论） |
