静态页面html传参数实现动态加载

最新推荐文章于 2024-05-09 21:12:04 发布

兔子敲代码

最新推荐文章于 2024-05-09 21:12:04 发布

阅读量1.3k

点赞数

文章标签： js html vue ajax javascript

本文链接：https://blog.csdn.net/qq_38499671/article/details/109237998

版权

静态页面实现参数传递，然后js加载对应的数据，这样就能实现前端加载动态的数据了，这样说可能不明不白！

举个栗子：用户1和用户2同时访问一个静态页面，但是页面内容显示的不一样，就是实现这样的区分，让html能够本地加载数据！

(function ($) {
$.getUrlParam = function (name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
 }
 })(jQuery);
		
var Id = $.getUrlParam('user');//
alert("当前用户id："+Id);

这样的话，我们再用ajax加载各个id所属的json数据，把对应的内容遍历出来，就可以啦！

页面访问例如：http://127.0.0.1:8020/文件目录/index.html?user=1

以上的方式，可以在html传递数字和英文，但是传递数字之后就会出现乱码，那么应该怎么解决呢？

将解码方式unescape() 改为decodeURI解码就可以了！如下：

 $.getUrlParam = function (name) {
 var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
 var r = window.location.search.substr(1).match(reg);
if(r!=null)return  decodeURI(r[2]); return null;//这样就可以传递汉字了