JavaScript参考手册 String函数 7080字
JavaScript参考手册 String函数 7080字
贵哥的编程之路
发布于 2022-08-15 13:30:02
发布于 2022-08-15 13:30:02
文章被收录于专栏：用户7873631的专栏
作者：陈业贵 华为云享专家 51cto(专家博主 明日之星 TOP红人) 阿里云专家博主
文章目录
- JavaScript charAt() 方法
- JavaScript charCodeAt() 方法
- JavaScript concat() 方法
- JavaScript endsWith() 方法
- JavaScript fromCharCode() 方法
- JavaScript indexOf() 方法
- JavaScript includes() 方法
- JavaScript lastIndexOf() 方法
- JavaScript match() 方法
- JavaScript String repeat() 方法
JavaScript charAt() 方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo">单击按钮显示字符串的第一个字符。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var str="HELLO WORLD";//字符串赋值给变量
document.getElementById("demo").innerHTML=str.charAt(0);
//返回在指定位置的字符。这个函数是从0开始计算的，0看做第一个字符'H'哈
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo">单击按钮显示字符串的最后一个字符。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var str="HELLO WORLD";//字符串赋值给变量
console.log(str.length);
var n=str.charAt(str.length-1);//str.length当做有几个字符。从1开始计算的那种哦
//浏览器显示出D最后一个字符是因为是从0开始计算的哦.这个函数charAt
document.getElementById("demo").innerHTML=n;
}
</script>
</body>
</html>
JavaScript charCodeAt() 方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo">单击按钮显示字符串的第一个字符的编码。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var str="HELLO WORLD";
var n=str.charCodeAt(0);//72==H.为什么呢？因为ascii码中A=65 B=66 C=67 D=68 E=69 F=70 F=71 F=72.返回在指定的位置的字符的 Unicode 编码。
document.getElementById("demo").innerHTML=n;
}//赋值给p标签<p id="demo">
/**
* 1、Unicode码扩展自ASCII字元集。Unicode最初打算作为ASCII的补充，可能的话，最终将代替它。
2、Unicode是一个编码方案，Unicode 编码共有三种具体实现，分别为utf-8,utf-16,utf-32，其中utf-8占用一到四个字节，utf-16占用二或四个字节，utf-32占用四个字节。
*
*/
</script>
</body>
JavaScript concat() 方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo">单击按钮连接两个字符串成新的字符串。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var txt1 = "Hello ";
var txt2 = "world!";
var n=txt1.concat(txt2);// 连接两个或更多字符串，并返回新的字符串。
document.getElementById("demo").innerHTML=n;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo">单击按钮连接2个字符串形成一个新的字符串。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var txt1 = "Hello ";
var txt2 = "world!";
var txt3=" Have a nice day!";
var n=txt2.concat(txt1,txt3);//哪个变量在开头哪个变量就一开始显示
document.getElementById("demo").innerHTML=n;
}//赋值给p标签
</script>
</body>
</html>
JavaScript endsWith() 方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<h2>JavaScript 字符串</h2>
<p id="demo"></p>
<p>注意: IE 11 及更早版本不支持 endsWith() 方法。</p>
<script>
let str = "Hello world";
document.getElementById("demo").innerHTML = str.endsWith("world");//区分大小写.
/*如果传入的子字符串在搜索字符串的末尾则返回 true，否则将返回 false*/
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<h2>JavaScript 字符串</h2>
<p id="demo"></p>
<p id="demo1"></p>
<p id="demo2"></p>
<p>注意: IE 11 及更早版本不支持 endsWith() 方法。</p>
<script>
let str = "To be, or not to be, that is the question.";
document.getElementById("demo").innerHTML = str.endsWith("question."); // true
document.getElementById("demo1").innerHTML = str.endsWith("to be"); // false
document.getElementById("demo2").innerHTML = str.endsWith("to be", 19); // true
/*如果传入的子字符串在搜索字符串的末尾则返回 true，否则将返回 false。第二个参数是：设置字符串的长度。默认值为原始字符串长度 string.length。*/
</script>
</body>
</html>
JavaScript fromCharCode() 方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo">单击按钮显示一个UNICODE编码的字符</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var n=String.fromCharCode(65);//把UNICODE转换成字符串.
document.getElementById("demo").innerHTML=n;
}//赋值给p标签<p id="demo">
</script>
</body>
</html>
JavaScript indexOf() 方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo"></p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var str="Hello world, welcome to the universe.";
var n=str.indexOf("welcome");//welcome首次出现的位置.从0开始数起的哦
document.getElementById("demo").innerHTML=n;
}
</script>
</body>
</html>
JavaScript includes() 方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p>点击按钮查看检测结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<p><strong>注意:</strong> IE 11 及更早版本不支持 includes() 方法 。</p>
<script>
function myFunction() {
var str = "Hello world, welcome to the Runoob.";
var n = str.includes("Runoob");//str变量中是否包含Runoob,包含返回true，否则false
document.getElementById("demo").innerHTML = n;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p>点击按钮查看是否包含要查找的字符串，找到的话返回 true，否则返回 false。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<p><strong>注意:</strong> IE 11 及更早版本不支持 includes() 方法 。</p>
<script>
function myFunction() {
var str = "Hello world, welcome to the Runoob.";
var n = str.includes("world", 12);从下标12的位置开始查找world
document.getElementById("demo").innerHTML = n;
}
</script>
</body>
</html>
JavaScript lastIndexOf() 方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo"></p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var str="I am from runoob，welcome to runoob site.";
var n=str.lastIndexOf("runoob");//runoob最后一次出现的位置
document.getElementById("demo").innerHTML=n;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo"></p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var str="I am from runoob，welcome to runoob site.";
var n=str.lastIndexOf("runoob", 20);
//从位置20开始查找给定值最后出现的位置
document.getElementById("demo").innerHTML=n;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo"></p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var str="I am from runoob，welcome to runoob site.";
var n=str.lastIndexOf("runoob", 9);
//定位在第 9 个字符，并从第 9 个字符开始往前搜索结果为 -1。-1代表没有啦
document.getElementById("demo").innerHTML=n;
}
</script>
</body>
</html>
JavaScript match() 方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo">单击按钮显示matches</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var str="The rain in SPAIN stays mainly in the plain";
var n=str.match(/ain/g);//(查找找到一个或多个正则表达式的匹配。)在字符串中查找 "ain":区分大小写
document.getElementById("demo").innerHTML=n;
}//赋值给p标签
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p id="demo">单击按钮显示matches。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var str = "The rain in SPAIN stays mainly in the plain";
var n=str.match(/ain/gi);//不区分大小写.查找找到一个或多个正则表达式的匹配。
document.getElementById("demo").innerHTML=n;
}
</script>
</body>
</html>
JavaScript String repeat() 方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<p>点击按钮显示复制连接后的字符串。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<p><strong>注意:</strong> IE 11 及更早版本不支持 repeat() 方法 。</p>
<script>
function myFunction() {
var str = "Runoob";
document.getElementById("demo").innerHTML = str.repeat(2);//复制"Runoob"两次
}
</script>
</body>
</html>
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2022-08-07，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录
腾讯云开发者
