HTML实现跳转到页面指定位置

HTML实现跳转到页面指定位置,第1张

<a href="#ct1">跳转到词条1</a>

<a href="#ct2">跳转到词条2</a>

<br>

<div id="ct1" style="height:1000px;">词条1</div>

<div id="ct2">词条2</div>

底下定好容器的id,在a的href中用#+id,就可以实现跳转了。

超文本标记语言,标准通用标记语言下的一个应用。

“超文本”就是指页面内可以包含、链接,甚至音乐、程序等非文字元素。

超文本标记语言的结构包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的具体内容。

由来

万维网上的一个超媒体文档称之为一个页面(外语:page)。作为一个组织或者个人在万维网上放置开始点的页面称为主页(外语:Homepage)或首页,主页中通常包括有指向其他相关页面或其他节点的指针(超级链接),所谓超级链接,就是一种统一资源定位器(Uniform Resource Locator,外语缩写:URL)指针,通过激活(点击)它,可使浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一。在逻辑上将视为一个整体的一系列页面的有机集合称为网站(Website或Site)。超级文本标记语言(英文缩写:HTML)是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。

网页的本质就是超级文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。[1]

定义

超级文本标记语言是标准通用标记语言下的一个应用,也是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,如何显示等)。浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容,对书写出错的标记将不指出其错误,且不停止其解释执行过程,编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是,对于不同的浏览器,对同一标记符可能会有不完全相同的解释,因而可能会有不同的显示效果。

页面跳转如果不是在程序里面的话都是通过a标签链接跳转的,而且a标签的跳转方式有

_blank是最常见的链接方式,表示超链接的目标地址在新建窗口中打开;

_self表示“相同窗口”。点击链接后,地址栏不变;

_top表示整页窗口;

_parent表示父窗口。

第一种,最直接的方法<a href=ms-appx:///html/nextpagehtmlGo to next page</a这样就创建了一个Go to next page的链接,在页面单击就可以跳转到目标html第二种,利用button,然后为其添加响应事件,完成跳转<button id=directNextpage onclick=windowlocationreload('/html/nextpagehtml')Direct Next Page</button注意windowlocationreload方法在WinJS中同样可以使用,这样,点击按钮,也能跳转到目标html文件第三种,其实跟第二种差不多,但是,响应事件在js里面完成,可以添加一些其他的 *** 作<button id=nextPageNext Page</buttonfunction clickNextPage(){windowlocationreload(/html/nextpagehtml);}documentgetElementById('nextPage')addEventListener(click, clickNextPage);以上三种方法都能正确地跳转到目标html,感觉还是第三种比较好,在响应跳转的同时也可以进行其他的 *** 作,例如传递参数等

1首先我们新建一个带有button按钮的页面

<button type="submit" class="form-contrpl">注册</button>

2button按钮不能直接添加herf属性,我们可以通过button的onClick事件来实现页面的跳转。

 第一种方法:windowopen()可以实现页面跳转。

第二种方法:给button的onClick一个触发事件

因为我们希望页面在点击登录按钮的时候实现页面跳转,所以函数是直接声明,而不是等页面加载完后立即执行的。

以上就是关于HTML实现跳转到页面指定位置全部的内容,包括:HTML实现跳转到页面指定位置、HTML的页面跳转方法有哪些、html跳转的几种方法等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/10176825.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-06
下一篇 2023-05-06

发表评论

登录后才能评论

评论列表(0条)

保存