JavaScript解析URL参数并赋值到表单

"JavaScript 接收地址栏传值" 在Web开发中，有时我们需要通过URL（统一资源定位符）向页面传递参数。这些参数通常以键值对的形式出现在URL的查询字符串（query string）部分。JavaScript 提供了简单的方法来解析和获取这些参数。在给定的代码示例中，我们看到一个名为 `QueryString` 的函数，它用于从当前页面的URL中提取查询字符串的参数，并将它们存储在一个对象中。 首先，让我们详细了解这个过程： 1. 获取URL: `var str = location.href;` 这一行代码获取当前页面的完整URL。`location.href` 是一个内置属性，返回浏览器窗口当前加载的URL。 2. 查找查询字符串: `var num = str.indexOf("?");` 这里是寻找查询字符串的开始位置，即问号（?）的位置。如果URL中没有查询字符串，`indexOf` 方法将返回 -1。 3. 截取查询字符串: `str = str.substr(num + 1);` 这一步是从问号后面提取整个查询字符串，不包括问号本身。 4. 分割键值对: `var arrtmp = str.split("&");` 使用 "&" 符号将查询字符串拆分为多个键值对，每个键值对都是一个字符串。 5. 遍历并解析键值对: 通过 `for` 循环遍历数组 `arrtmp`，对于每个键值对，使用 `indexOf("=")` 找到等号的位置，然后用 `substring` 和 `substr` 方法分别提取键和值。 6. 存储参数: `this[name] = value;` 将解析出的键值对存入 `this` 对象，这使得可以通过键来访问这些值。这里的 `this` 在这个上下文可能是指代新创建的 `QueryString` 实例。 7. 赋值到页面元素: 之后的代码创建了一个 `QueryString` 的实例并赋值给变量 `abc`，然后将这些参数值分别赋给页面上ID为 "select2"、"select3" 和 "select" 的元素的 `value` 属性。 通过这种方式，JavaScript 可以轻松地从URL中获取参数，这对于实现动态加载数据或者传递初始状态等场景非常有用。在实际应用中，还可以进行错误检查和处理，例如检查是否所有必需的参数都存在，或者对参数进行类型转换等操作。