JS获取url中的请求参数,以及整合thymeleaf获取model中的属性值

项目场景：

记录一下前端如何读取url上的参数以及使用thymeleaf模板下如何接受model属性值

解决方案：

1.window.location方法

• URL又叫做统一资源定位符
• 完整的组成部分是scheme://host:port/path?query#fragment

具体实现

• window.location.href: 返回地址栏中整个URL值
  eg：http://www.baidu.com:80/view.asp?id=209#cmt1323

• window.location.protocol: URL 的协议部分
  -eg: http:

• window.location.host: 返回主机部分
  -eg:www.baidu.com

• window.location.port:返回端口部分,80端口返回空字符串

• window.location.pathname: 返回请求路径
  eg:/view.asp

• window.location.search:返回参数部分 eg: ?id=209
  我们使用到的就是这个.search,至此我们只需要写一个简单的函数即可

function getParam(){
	//通过substring方法进行截取?后的字符串
   var paramStr = window.location.search.substring(1);
   //分割&符号
   var arr = paramStr .split('&')
   var params = {}
   //进行循环处理
   for (var i = 0; i < arr.length; i++) {
       var pair = arr[i].split('=')
       params[pair[0]] = pair[1]
   }
 	console.log(params)
   return params
}

对于通过model对象传值获取方法,这里用的是thymeleaf

<script th:inline="javascript">
            var param= [[${model中定义的值}]];
</script>