两个新方法
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>