在查询字符串中添加参数可以通过使用输入类型为文本的表单元素来实现。以下是一种常见的方法:
<input>
标签,并将其类型设置为"text"。<input type="text" id="paramInput">
URLSearchParams
对象来处理查询字符串。// 获取用户输入的参数值
var paramValue = document.getElementById("paramInput").value;
// 创建URLSearchParams对象
var searchParams = new URLSearchParams(window.location.search);
// 添加参数到查询字符串
searchParams.set("paramName", paramValue);
// 更新浏览器地址栏
window.history.replaceState({}, '', `${window.location.pathname}?${searchParams}`);
在上述代码中,paramName
是要添加的参数名,paramValue
是用户输入的参数值。通过searchParams.set()
方法将参数添加到查询字符串中,然后使用window.history.replaceState()
方法更新浏览器地址栏,以显示包含新参数的URL。
这种方法适用于在前端页面中动态添加参数到查询字符串,可以用于各种场景,例如搜索功能、筛选功能等。
腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云