-----要求-----
用JavaScript编写如图1所示页面,当在第一个文本框中输入URL http://test.cn/index.jsp?key0=0&key1=1&key2=2,点击按钮“解析参数“后,在下面的三个文本框中分别显示解析出来的参数,如图2所示。
图1
图2
-----代码示例-----
<html>
<head>
<!-- 设置字符编码为 gb2312 -->
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<!-- http-equiv 属性相当于 HTTP 头部中的一个字段,它设置了文档的内容类型Content-Type,告诉浏览器如何解释文档的字节流 -->
<script>
function parseQueryString(url) {
// 定义了一个名为 parseQueryString 的函数,该函数接受一个参数 url。
var obj = {};
// 初始化一个空对象 obj,用于存储解析后的查询参数。
// 将URL按照'?'分割为两个部分
var a = url.split('?');
// 如果没有查询参数,直接返回
// 即检查分割后的数组长度。如果长度为1,说明URL中没有查询参数,直接返回。
if(a === 1) return;
// 将查询参数部分按照'&'分割为多个键值对
var b = a[1].split('&');
for(var i = 0, length = b.length; i < length; i++) {
// 将每个键值对按照'='分割,并将结果存入对象
var c = b[i].split('=');
// 使用 split('=') 方法将每个键值对分割成键和值,并将它们存入对象 obj 中(键作为属性名,值作为属性值)
obj[c[0]] = c[1];
}
// 将解析的参数值填充到页面表单中
document.test.key0.value=obj.key0;
document.test.key1.value=obj.key1;
document.test.key2.value=obj.key2;
}
</script>
</head>
<body>
<!-- 创建一个名为 "test" 的表单 -->
<form name="test">
<!-- 输入要解析的 URL -->
输入URL:<input type="text" name="t1" size="50" ></input>
<!-- 点击按钮触发解析函数 -->
<input type="button" value="解析参数" onclick="parseQueryString(document.test.t1.value)"></input><BR>
<BR>
key0: <input type="text" name="key0" size="20" ><BR>
key1: <input type="text" name="key1" size="20" ><BR>
key2: <input type="text" name="key2" size="20" ><BR>
</form>
</body>
</html>
-----HTML中嵌入JavaScript代码时常用函数和命令-----
http://t.csdnimg.cn/jqcC4http://t.csdnimg.cn/jqcC4
----- JavaScript 中的split 字符串操作-----
split()
方法被用来将一个字符串按照指定的分隔符分割成子字符串数组,是字符串操作中非常常见且实用的一个方法:
// 按逗号分
const str = "apple,banana,cherry";
const result = str.split(",");
console.log(result); // 输出 ["apple", "banana", "cherry"]
// 同理,还可以按空格分
// 结合正则表达,按多个分隔符分割(空格、逗号和点号)。“ + ”确保了即使有多个连续的空格、逗号或点,也会被视为一个分隔符来进行分割操作
const str = "apple banana, cherry.apple";
const result = str.split(/[ ,.]+/);
console.log(result); // 输出 ["apple", "banana", "cherry", "apple"]
// 限制分割次数
const str = "one,two,three,four";
const result = str.split(",", 2);
console.log(result); // 输出 ["one", "two"]
// 注意比较以下两种情况
const str = "hello";
const result = str.split("");
console.log(result); // 输出 ["h", "e", "l", "l", "o"]
const str = "hello";
const result = str.split(",");
console.log(result); // 输出 ["hello"]
标签:web,const,操作题,Javascript,-----,split,str,obj,result From: https://blog.csdn.net/weixin_68085527/article/details/139599344