HTML网页自动跳转的5种方法

HTML网页自动跳转的5种方法

(推荐教程:html教程)

在我们进行网站创建时经常会遇到需要进行网页跳转的情况,本文就来为大家介绍五种网页自动跳转的方法.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

网页自动跳转5种方法:

第一种网页自动跳转方法:meta refresh自动跳转法

立即学习“前端免费学习笔记(深入)”;

在网页的head区域的meta refresh标签中,加入自动跳转代码,可实现网页的立即或延时自动跳转。 

示例如下:

 

上述html代码中的“10”是延时跳转的时间,单位是秒。如果设为0,就表示立即跳转。

http://xfbbs.com ”是跳转的目标地址,可以是同一域名下的站内相对路径,也可以是不同域名的站外地址。 

由于搜索引擎能够读取html,所以对于这种自动跳转方法,搜索引擎是能够自动检测出来的。 被视为作弊,则主要看跳转时间。如果跳转时间为0,就可能会被视为作弊,从而受到惩罚。如果有时间延迟(一般3秒以上),就会被视为正常应用。

第二种网页自动跳转方法:body onload自动跳转法

在网页加载时通过onload事件指定parent.location进行自动跳转。 

示例如下:

 

这种方法与第一种方法一样,能够被搜索引擎识别。

第三种网页自动跳转方法:javascript自动跳转法

javascript可以实现网页的自动跳转,如果要实现立即跳转,将跳转代码放在网页的head区域即可。 

示例如下: 

 location.replace(" http://xfbbs.com/yule/tietu/ ") 

其中的“ http://xfbbs.com/yule/tietu/ ”是重定向目标地址。

 由于搜索引擎无法解析javascript,所以搜索引擎便无法识别用javascript脚本进行的自动跳转。

第四种网页自动跳转方法:表单自动跳转法

对于表单大家都很熟悉,就是将表单中填写的内容,提交到action参数中指定的url地址中,目标url再对接收到的数据进行处理。利用这一点,我们可间接的实现网页跳转,只不过,我们并不需要提交任何表单内容。再结合javascript脚本,可以对表单进行自动提交。

示例如下: 

   document.form1.submit() 

其中form1名称任意,但二处form1应该统一。

action中的url地址必须以文件名结尾,例如“action= http://xfbbs.com/ ”或“action= http://xfbbs.com/yule ”便是不规范写法。method可以是get也可以是post,但根据我的经验,提交空表单时最好使用get。

 众所周知,由于搜索引擎的蜘蛛程序是不会填写表单的,所以搜索引擎便无法识别通过这种方法实现的网页自动跳转。

第五种网页自动跳转方法:程序跳转法(response.redirectserver.transfer

每种程序都有各自的页面跳转方法,例如asp中使用response.redirect 来进行跳转。

跳转范例如下:

response.redirect " http://xfbbs.com "

它的作用是,asp程序运行到该行代码后,会立即跳转到目标url地址中去。 

在asp中,除了使用response.redirect 做跳转外,还有一个跳转方法,用server.transfer进行跳转。

跳转范例如下: 

response.redirect "/yule/tietu/index.html"

注意,这里的url地址,必须是站内地址,且url地址必须以文件名结尾,例如:response.redirect "/yule/tietu/" 便是错误用法。 

response.redirectserver.transfer都能实现网页自动跳转,但二者也有不同之处,前者可以跳转到站内url,也可以跳转到站外url,而后者只能跳转到站内文件,且浏览器地址栏的url将保持不变。

server.transfer还有许多好处,这里不多详述,大家可在搜索引擎中查找它的更多资料。 使用response.redirect 跳转虽然是在服务器端完成跳转的,但它最终是转换成html后在客户端执行的,因此,也能被搜索引擎识别,过多的使用亦会被当作作弊处理。

如果是在同一网站内部的不同网页间跳转,建议使用server.transfer跳转,server.transfer肯定不会被搜索引擎视为作弊。

更多编程相关知识,请访问:编程视频!!

以上就是HTML网页自动跳转的5种方法的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1548635.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月21日 20:05:00
下一篇 2025年12月21日 20:05:12

相关推荐

  • html是一种页面什么型语言?

    html是一种页面“描述”型语言。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等。 (推荐教程:html教程) html是一种页面“描述”型语言。 HTML(Hyper Text Mark-up Language)即超文本标记语言或超文本链接标…

    2025年12月21日
    000
  • 一起了解script标签中的async和defer属性

    前端当然要从 HTML 开始,我们来聊聊在 script 标签中加上 async/defer 时的功能及差异。 都明白的道理 我们都知道,浏览器解析 HTML 是一行一行按照顺序向后读取的,在传统的写法中,当浏览器读到 时,便会暂停解析 DOM,同时立即开始下载 中定义的资源,并在下载完成后立刻执行…

    2025年12月21日
    000
  • 怎么在html中实现图片超链接

    在html中实现图片超链接的方法:可以通过将图像元素嵌套在a元素中,使其成为一个链接,如【】。 目的: 对整个一幅图像文件设置超链接 思路: 可以通过将图像元素嵌套在a元素中使其变为一个链接。 立即学习“前端免费学习笔记(深入)”; (学习视频推荐:html视频教程) 语法: @@##@@ 举例: …

    2025年12月21日
    000
  • HTML hr是什么意思

    HTML hr是用于在页面中创建一条水平线的一种标签,在HTML中,标签没有结束标签,其使用语法如“这是段落这是段落”。 推荐:《HTML视频教程》 HTML 标签 定义和用法 标签在 HTML 页面中创建一条水平线。 立即学习“前端免费学习笔记(深入)”; 水平分隔线(horizontal rul…

    2025年12月21日
    000
  • html中行内元素与块级元素的区别是什么

    html中行内元素与块级元素的区别是:1、块级元素总是在新行开始,行内元素和其他元素在同一行;2、块级元素的高度、行高可控制,行内元素的高度、行高部分可改变;3、块级元素的宽度与内容无关,行内元素的宽度只与内容有关。 块级元素: (学习视频分享:html视频教程) 1、总是在新行上开始,占据一整行;…

    2025年12月21日
    000
  • 添加背景音乐的html标签是什么

    添加背景音乐的html标签是,bgsound是用以插入背景音乐,但只适用于IE,在netscape和firefox中并不适用,其参数设定很少,语法如“”。 推荐:《HTML视频教程》 添加背景音乐的html标签是。 bgsound 是用以插入背景音乐,但只适用于 IE,在netscape 和 fir…

    2025年12月21日
    000
  • html中的ul标签的作用是什么

    html中的ul标签的作用是:用于定义无序列表,如【】。ul标签支持class、dir、id、lang、style、title、xml等核心属性。 作用: 标签用于定义无序列表。 (学习视频分享:html视频教程) 将 标签与  标签一起使用,创建无序列表。 立即学习“前端免费学习笔记(深入)”; …

    2025年12月21日
    000
  • span是块元素吗?

    span不是块元素,而是内联元素(行内元素),可以对文档中的行内元素进行组合。span只是把内容定义成一个整体进行操作,不影响布局和显示,而且span没有什么实用特性,它的作用是围绕HTML代码中的其他元素,为其指定样式。 (推荐教程:html教程) span不是块元素,而是内联元素(行内元素),主…

    2025年12月21日
    000
  • 利用前端基础制作html开关图标

    我们先来看下效果图: (学习视频分享:html视频教程) html代码: 立即学习“前端免费学习笔记(深入)”; 开关图标 ON OFF css样式: body { text-align: center } .SwitchIcon { margin: 200px auto; } #toggle-bu…

    2025年12月21日
    000
  • www中的超文本文件是用什么语言编写的

    www中的超文本文件是用HTML语言(即超文本标记语言)编写的。WWW服务器中所存储的页面是一种结构化的文档,采用超文本标记语言(HTML)书写而成。 万维网(world wide web)上的一个超媒体文档称之为一个页面(外语:page)。作为一个组织或者个人在万维网上放置开始点的页面称为主页(外…

    2025年12月21日
    000
  • html中的特殊字符如何源码输出

    要实现Html中特殊字符不被转义(源码输出),有以下三种方法:方法一: (推荐教程:html教程) 将HTML代码嵌入到 举例: 立即学习“前端免费学习笔记(深入)”; body>哈哈哈dfdfd 以上就是html中的特殊字符如何源码输出的详细内容,更多请关注创想鸟其它相关文章!

    2025年12月21日
    000
  • 利用html实现一个三级菜单

    首先我们先来看一下效果图: (推荐教程:html教程) 完整代码: 立即学习“前端免费学习笔记(深入)”; 下拉菜单 /*重置浏览器默认样式*/ * { padding: 0; margin: 0; font-family: “Microsoft YaHei”; list-style: none; …

    2025年12月21日
    000
  • 在html页面中加入js可以用什么方法

    方法一:在head标签内引入JS文件 (推荐教程:html教程) 方法二:在body标签内写JS代码 //在这里面写你的js代码 </html 以上就是在html页面中加入js可以用什么方法的详细内容,更多请关注创想鸟其它相关文章!

    2025年12月21日
    000
  • 谈谈HTML标签元素中alt和title属性的区别

    本篇文章给大家介绍一下HTML标签元素中alt和title属性的区别。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。 概述 这道题大概还可以加个限定词,我们暂且把 标签排除在本次讨论之外。 元素的 alt 和 title 属性 有什么区别? (推荐教程:html教程) ALT 属性…

    2025年12月21日
    000
  • 分享三款美观的html按钮样式

    样式如下: (推荐教程:html视频教程) 按钮样式一: 立即学习“前端免费学习笔记(深入)”; #login_click{ margin-top:32px; height:40px;}#login_click a { text-decoration:none;background:#2f435e;…

    2025年12月21日 好文分享
    000
  • html怎么实现上角标效果

    先来看看效果: (推荐教程:html视频教程) 实现代码: 立即学习“前端免费学习笔记(深入)”; 制作角标的方法 .con{ height: 250px; width: 200px; margin: 0 auto; overflow: hidden; margin-top: 100px; posi…

    2025年12月21日
    000
  • 网页开发中实用的11个文本输入和6个按钮操作特效

    文本输入特效 1.power-mode-input PowerModeInput 可以让你的文本输入框更引人注目。 地址:https://github.com/lindelof/power-mode-input 2.TextInputEffects 简单的样式和效果,可增强文本输入交互。 地址:ht…

    2025年12月21日 好文分享
    000
  • 深入了解HTML中的编码规范

    本文档的目标是使HTML代码风格保持一致,容易被理解和被维护,如果自己没有这种习惯,请好好选择你的IDE,别再用“文本编辑器”。 1 代码风格 1.1 缩进与换行 [强制] 使用 4 个空格做为一个缩进层级,不允许使用 2 个空格 或 tab 字符。 示例: 立即学习“前端免费学习笔记(深入)”; …

    2025年12月21日
    000
  • html文档中怎么把图片作为背景?

    在html中,可以通过给body标签设置css background或background-image样式来把图片作为背景,语法格式“background/background-image:url(“图片路径”);”。 (推荐教程:html教程) html文档中可以使用css…

    2025年12月21日
    000
  • 利用html实现进度条效果的方法

    html代码: 视频学习推荐:html视频教程 css代码: .progress { height:10px; background:#ebebeb; border-left:1px solid transparent; border-right:1px solid transparent; bor…

    2025年12月21日
    000

发表回复

登录后才能评论
关注微信