从 URL 获取信息并显示和隐藏 html 元素

Question

我正在尝试检查是否已运行搜索，以便我可以使用 JS 对此做出反应，并根据页面加载情况隐藏和显示不同的 div。

如何使用 JavaScript 和 Jquery 从 URL 获取信息？

www.localhost.com/search?name=&category=

我想获取名称和类别的信息，如果它们不为空，我想显示这个 div

<div class="Search-results"></div>

并隐藏这个

<div class="Search-params"></div>

这可能吗？

Answer 1

本网站上的许多解决方案都是在较新的 URL API 实施之前完成的，并且涉及解析字符串

使用URL.searchParams，它有多种获取、设置和迭代键和值的方法，而无需解析字符串

const url =new URL('http://www.localhost.com/search?foo=bar&name=&category=')
const params = url.searchParams;

// check if 2 params exist and have values
if(!params.get('name') && !params.get('category')){
  console.log('name & category are empty or not available')
}
// output value of valid param
console.log('value of foo = ', params.get('foo'))

// add a new param and output updated href string
params.set('new-param', 123);
console.log('Updated url\n', url.href)

// loop through all params
for(let p of params){
   console.log('value of', p[0] , ' is ', p[1] || 'empty')
}

Answer 2

这行得通：

if(!searchParams.get('name') && !searchParams.get('category')){

  }
  else{

        $('.search').hide()


}