html跳转网页代码

我见过最离谱的跳转跳转代码，是网页某个电商网站把“支付成功”页面的跳转延迟设成了10秒。用户付完钱盯着白屏，代码以为钱被吞了，跳转客服电话被打爆。网页后来他们把代码改成这样：<meta http-equiv="refresh" content="0; url=https://example.com">，代码世界安静了。跳转

跳转这事，网页说穿了就三种玩法。代码第一种是跳转上面那种meta标签，写在head里，网页content="0"表示0秒后跳转，代码你改成5就是跳转等5秒。这玩意儿简单粗暴，网页适合整页替换。代码但有个坑——如果目标页面有防盗链，或者需要POST数据，meta就废了。

第二种是JS跳转，window.location.href = "https://example.com"。这行代码能塞在button的onclick里，也能放在setTimeout里延迟执行。我见过一个骚操作，有人用window.location.replace()跳转，这方法不会在浏览器历史里留下当前页记录，用户按返回键直接回到更早的页面。适合做支付成功后的跳转，防止用户后退重复提交订单。

第三种是服务端302重定向，php的header函数或者nginx的rewrite规则。这玩意儿不关HTML的事，但很多新手分不清。记住一点：HTML跳转意味着浏览器先加载了当前页面，再执行跳转指令。服务端跳转则是浏览器根本没收到当前页面的内容，直接收到新地址。区别在用户体验上就是——前者会闪一下，后者无感。

写跳转代码时，最烦人的是相对路径和绝对路径的混用。你写url=./page.html，如果当前页面在子目录里，跳转就找错地方。我自己的习惯是：站内跳转用根目录绝对路径，比如/user/login，站外跳转必须带完整协议头https://，不然浏览器会把它当成站内路径拼上去，结果404。

有个细节容易忽略——跳转前的提示。直接0秒跳转，用户根本不知道发生了什么。我建议至少给个1秒的缓冲，页面显示“正在跳转，若无响应请点击这里”，配合一个超链接兜底。这比干巴巴的代码靠谱多了。毕竟用户可能开着广告拦截插件，把meta refresh给拦了，这种事我碰到过三次。

还有编码问题。跳转地址里带中文参数，必须用encodeURIComponent()处理，不然浏览器解析乱码。之前帮朋友修过一个问题，他的搜索页跳转总是显示“%E6%90%9C%E7%B4%A2”，就是没编码直接拼URL的后果。

最后说个安全上的坑。跳转目标如果是用户输入的内容，比如?url=用户输入这种，必须做白名单校验。不然有人构造javascript:alert(1)或者data:text/html,...这种伪协议，直接XSS。我见过一个论坛的跳转功能被利用来钓鱼，用户点链接跳到一个长得一模一样的假登录页。

代码写多了你会发现，跳转这功能看着简单，但涉及用户体验、浏览器兼容性、安全防护。下次写跳转，先问自己三个问题：用户需要等待吗？目标地址可靠吗？如果JS被禁用还能跳吗？想清楚再动手，比在网上复制粘贴代码强一百倍。