两个新方法
1:startsWith(判断开头)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script>
let str="wqfge"
//判断字符串是否是以w开头的,返回true则代表是的,返回false代表不是
console.log(str.startsWith('a'))
</script>
</html>
简单示例:判断网页链接开头的状态
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script>
/* let str="wqfge"
//判断字符串是否是以w开头的,返回true则代表是的,返回false代表不是
console.log(str.startsWith('a')) */
let str='https://www.bilibili.com/video/av20327829?p=8'
if(str.startsWith('http://')){
alert('普通网址')
}
else if(str.startsWith('https://')){
alert('加密网址')
}
else if(str.startsWith('git://')){
alert('加密网址')
}
</script>
</html>
2:endWith(判断结尾)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script>
let str="wqfge"
//判断字符串是否是以e结尾的,返回true则代表是的,返回false代表不是
console.log(str.endsWith('e'))
</script>
</html>
打印结果
简单示例:判断文件的后缀
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script>
//endWith
let str = '1.png';
if (str.endsWith('.txt')) {
alert("文本文件")
} else if (str.endsWith('.jpg')) {
alert("jpg")
} else if (str.endsWith('.png')) {
alert("png")
}
</script>
</html>
字符串模板
美元符号+花括号作用就是将定义好的变量a塞进字符串里面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script>
//反单引号,就是字符串模板
let q = 22;
let str = `a${q}s`; //美元符号+花括号作用就是将定义好的变量a塞进字符串里面
console.log(str)
</script>
</html>
打印结果如下:
小案例对比:
一般拼接
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script>
let title = "标题";
let content = "内容";
//一般拼接方法,不能折行
let str = '<div>\
<h1>' + title + '</h1>\
<p>' + content + '</p>\
</div>';
console.log(str)
</script>
</html>
字符串模板拼接
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script>
let title = "标题";
let content = "内容";
//模板字符串
//反单引号,就是字符串模板
let str2 = `<div>
<h1>${title}</h1>
<p>${content}</p>
</div>`;
console.log(str2)
</script>
</html>