-
2021-06-18 06:12:55
文章目录
`` 标签介绍
空链接的作用以及``和``的区别
标签介绍
是HTML的标准标签之一,称为链接或是超链接标签。这个标签作用是定义一个锚(anchor),根据链接的目标的差异,分为两种状况:
指定一个其他文档的外部连接(href指定地址); 点击链接跳转到新的页面,是在原窗口还是新开窗口可以通过target属性设置。
创建一个本文档内部的链接。(href的值设置为#+元素的name或id),点击页面定位到指定标签的区块,适用在有滚动条的窗口。
比如href.html页面有如下内容:
Div 1Div 2Div 3页面效果如下:
但点击 以上红色框框的链接时, 浏览器会滚动并定位到Div 2区块,地址栏显示也会变化为“href.html#inerdiv2”。
在线效果演示:
http://jsrun.net/g2vKp
空链接的作用以及和的区别
在很多时候, 需要设置超链接不发生跳转,最有可能出现的场景是:
的点击有更复杂的逻辑,需要通过onclick的函数才能完成,所以就不需要href。但是如果不加href属性,又没有超链接的页面效果,也就是不会出现下划线,以及点击之后字体样式的变化。特别是函数执行的是异步的请求,这种状况广泛的出现在一些前端框架里。
设置href属性点击不生效,称为空链接,常用的又两种方法:
, 本页链接,链接到当前页面
,空链接, 相比# , 如果有滚动条不会到顶部
这两种方式都是不产生跳转到效果。因为href可以直接识别JS的代码,所以可以使用javascript:的方式。
javascript: 是一个伪协议,通过链接调用一个javascript函数,如果函数为空,则调用的是
空函数。 javascript:;也可以写为javascript:void(0);,称为死链接,更常使用在Ajax中
但是javascript:void(0) 的使用会有一些问题,比如在IE中会引起动画停止播发等问题。 href="#"又有可能发生页面滚动,可以使用两个或多个 # 就不会发生页面的滚动了。比如
有滚动条不会到顶部
更多相关内容 -
pythonweb大作业
2019-09-19 09:29:19pythonweb大作业,实现增删改查。分享pythonweb大作业,云认证平台登录,使用的是mongodb数据库。可查看运行教程 链接:https://blog.csdn.net/weixin_43960044/article/details/101012182 -
weblink测试软件,测试网络连接,死链,空链接
2010-10-15 14:09:19网连测试。测试软件。上线网站测试,页面,图片,链接丢失,404,bug等1. -
uniapp使用web-view跳转外部链接
2020-08-12 13:56:571.创建一个空的文件 2.在文件夹里放置web-view <view> <web-view :src="url" :progress="false"> </web-view> </view> 3.在js里接收传递过来的链接 <script> export default...1.创建webView跳转公用文件(home是调用处);
<template> <web-view :src="url"></web-view> </template> <script> export default { name: "index", data(){ return{ url:'' } }, onLoad(val){ //动态获取的url this.url=decodeURIComponent(val.url) } } </script> <style scoped> </style>
2.在使用页面调用webview跳转(encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。敲黑板~重点)
//页面调用处 <uni-grid-item @tap="queryCorpInfo"> <image class="image" src="../../../static/img/home/corpInfoImage.png" mode="aspectFill"></image> <text class="text">跳转外部连接</text> </uni-grid-item> //执行方法 queryCorpInfo(){ let url = this.baseHtmlUrl+'qhbs_h5_v1/pages/corpInfo/corpInfo.html' var typefrom = 'wechat'; url = encodeURIComponent(url + '?typefrom=${typefrom}'); uni.navigateTo({ url: '../../webview/index?url='+ url }); }
3.html中获取携带的参数。
//获取地址栏参数,name:参数名称 function getUrlParms (name) { let url = window.location.href;//获取请求进来的完整url let tstr = url.substring(url.indexOf('?') + 1).split('&');//先截取url的?后面的参数部分,在根据&分割成参数数组 let result = {}; tstr.forEach((item) => { let res = item.split('=');//res为type,my-component1.vue。 res[0]为type,res[1为]my-component1.vue result[res[0]] = res[1];//构造成键值对形式 res[0]为键,res[1]为值 例:type: "my-component1.vue" }) return result[name];//通过键取值 } var type = getUrlParms("type");//调用函数即可
-
关于web页面打开空白的情况
2017-11-12 21:00:00近期用户反映网站打开后白屏但是刷新后就有可能会好,通过fidder抓包发现header有返回值,body没有返回值,Content-...本文转自 水滴的历程 51CTO博客,原文链接:http://blog.51cto.com/12390959/1982505近期用户反映网站打开后白屏但是刷新后就有可能会好,通过fidder抓包发现header有返回值,body没有返回值,Content-Length: 0;
看到浏览器存在以下报警:
The certificate used to load https://xxxxxxx.com uses an SSL certificate that will be distrusted in an upcoming release of Chrome. Once distrusted, users will be prevented from loading this resource. See https://g.co/chrome/symantecpkice
,经检测发现并不是ssl证书问题,还在查找
本文转自 水滴的历程 51CTO博客,原文链接:http://blog.51cto.com/12390959/1982505
-
Java web 数据库查询时候出现空指针异常
2020-05-24 22:59:14Java web 数据库查询时候出现空指针...但运行在Tomcat服务器上依然出现空指针异常,这就让人很困惑了,后来发现是Tomcat上没有添加链接数据库的jar包 解决办法 向Tomcat中的lib文件夹中添加 参考:https://blog.csdn.nJava web 数据库查询时候出现空指针异常
在做一个Java web项目时查询数据库总是报出空指针异常。
可能原因1:
SQL语句中包含中文,MySQL服务器的字符编码格式不支持中文,导致无法识别中文,所以一直没有查询结果
解决方法
在数据库url里面添加:
此时在IDEA上就能够正常运行了但运行在Tomcat服务器上依然出现空指针异常,这就让人很困惑了,后来发现是Tomcat上没有添加链接数据库的jar包
解决办法
向Tomcat中的lib文件夹中添加
参考:https://blog.csdn.net/qq_39237781/article/details/97687251
-
解决java web链接数据库时出现500的问题
2018-09-28 23:31:43因为刚接触web,所以,唉。。。说多了都是泪啊。。。。 说说今天遇到的问题, 百度了一下,说明是数据库没连接上。但是检查了一下自己的配置,自己已经导入了数据库jar包了啊,这就有点玄学了。。。 然后回来又... -
web前端学习(四)——HTML5的超链接标签设置(页面间链接、锚链接以及邮件链接)
2020-12-19 18:10:03这里的 href代表的是链接路径(#代表空链接)。 target后面跟的如果是 -self,则打开自身窗口;如果是 -blank,则打开新建窗口。 下面我们来看一个页面间链接的小实例:???????????? 实例一: <!doctype ... -
微信小程序 web-view 在ios显示空白页面
2018-10-21 12:56:50最近遇到的一个问题,小程序使用web-view链接到H5页面,业务域名已经配置过了,在安卓系统上也是没有问题,只有ios不能正常显示,出现空白页面。在网上几番查找后,没有效果。 首先下载了safari的windows版(原晾... -
解决WebView显示空白问题
2020-01-02 17:09:13目前市面上大部分app都采用混合应用的开发模式,可以说是目前的一种主流,一些非主要的功能和一些更新频率较快的页面都会采用web页面来进行开发,可以极大的提高开发效率,同事避免app多次发版审核带来的繁琐。... -
Web基础 HTML标签 六种超链接标签的使用方式
2022-03-29 19:46:56Web基础 HTML标签 六种超链接标签的使用方式 分别是:外部链接、内部链接、空链接、下载链接、网页元素链接、锚点链接的使用方式 -
html中链接<a>------------如何设置空链接或者无效链接
2015-07-07 11:33:54Example Source Code [www.52css.com] href="javascript:void(0)" onclick="javascript:woaicssq(1)">52CSS.com Div CSS教程 CSS布局实例 WEB标准化 1、我们为 -
C# winform中使用WebBrowser链接web之后,web加载缓慢怎么解决?
2018-06-12 05:55:57如题,winform中使用WebBrowser链接web之后,web加载缓慢怎么解决? 第一次加载页面缓慢,使用鼠标右键菜单中刷新以及F5刷新,加载异常缓慢,且出现较长时间空白。请问怎么解决?后台什么代码都没有,只是... -
java web点击链接用js判断用户是否已经登录 (js获取session及判断是否为空)
2016-02-16 15:13:571.链接代码: onclick="return jiaru()" style="margin-top:40%;margin-right:0%;font-weight:bold;font-size:25px;color:yellow;text-decoration:none">加入购物车 2.js代码: function jiaru() { var... -
【Java Web问题解决】过滤器Filter进行编码过滤后页面空白、显示不了原因及解决办法
2019-09-27 13:48:31原文链接如下: 【Java Web问题解决】提交表单后显示乱码原因及解决办法 当时还没有学到过滤器,说过学到过滤器后和大家分享用过滤器解决乱码问题 如今学到了,就拿出来和大家分享 过滤器解决乱码文章链接如下: ... -
在小程序里添加跳转外部链接web-view(使用的是uni-app)
2019-09-30 15:23:281.创建一个空的文件 2.在文件夹里放置web-view <view> <web-view :src="url" :progress="false"> </web-view> </view> 3.在js里接收传递过来的链接 <script> ... -
解决uniapp使用web-view链接本地html页面出现2-3s的白屏问题的记录
2020-04-20 14:54:58根据uniapp官方的示例,使用web-view 链接本地html页面,加载时出现了2-3s的白屏之后才会渲染html页面。 <template> <view><web-view src="/hybrid/html/local.html"></web-view></... -
WEB发展简史,Web1.0到Web3.0的发展历程
2019-04-04 10:47:02WEB World Wide Web 万维网,通常指的是网页和网站,现在已经是互联网的代名词,也是互联网中重要的核心部分。到目前为止,web发展已经有将近30年的历史了,万维网也经历了web1.0到web3.0的发展。从最初的商业用途到... -
常见WEB漏洞原理分析
2019-08-09 11:47:05跨站脚本漏洞是因为Web应用程序时没有对用户提交的语句和变量进行过滤或限制,攻击者通过Web页面的输入区域向数据库或HTML页面中提交恶意代码,当用户打开有恶意代码的链接或页面时,恶意代码通过浏览器自动执行,... -
web连接数据库时,报空指针java.lang.NullPointerException问题--可能的解决方式
2017-04-25 21:53:21序言: 好吧,第一次写CSDN博客,其实从一开始学计算机,到现在,快两年了,中间就不断的遇到问题,基本通过上这博客看的 ...写web时,需要用到数据库的数据,参着网上的方法自己写了一个数据库连接类,... -
Material Design Component 4 Web 框架推送
2019-01-29 13:35:12MD不用多说了, GUI领域处于统治地位的规范, 上次我们介绍了基于MD实现的web框架mdl, 但是很遗憾mdl的开发团队于多年前放弃这个项目了, 取而代之的是MDC: Material Design Component MDC更像是一款ui插件而不是ui... -
Python 爬虫篇-爬取web页面所有可用的链接实战演示,展示网页里所有可跳转的链接地址
2019-03-06 21:19:28原理也很简单,html链接都是在a元素里的,我们就是匹配出所有的a元素,当然a可以是空的链接,空的链接是None,也可能是无效的链接。 我们通过urllib库的request来测试链接的有效性。 当链接无效的话会抛出异常,我们... -
软件测试---------Web功能测试点(超详细)
2021-11-11 21:20:27无空链接 – 测试所链接的页面是否存在 ③没有孤立的页面 – 孤立页面是指没有链接指向该页面,只有知道正确的URL地址才能访问 2、表单测试: ... -
Web端测试方法
2020-05-11 14:16:27web端通用测试点请移步 1. Web 测试的总体策略 2. Web 测试的范围 √ 功能 √ 性能 √ 界面 √ 兼容性 √ 安全性 √ DB √ 文档 2.1 功能测试 ☆ 功能测试主要从链接、表单、Cookies、设计语言、数据库、文件上传等... -
网页中链接的分类
2018-08-03 22:00:18按照链接路径的不同,网页中的超链接一般分为三种类型 1、内部链接——单击该超链接连接到同一网站的另外一个页面。 2、锚点链接——单击该超链接连接到同一页面的某一个位置 3、外部链接——单击该超链接连接到其他... -
WebAPI Post模式下传递、接收参数的几种方法
2020-08-24 16:35:56首先还是老样子,创建一个空的ASP.NET WebAPI工程,在Models文件夹下创建一个实体类:User,代码如下: using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace WebApi.... -
【1+X Web前端等级考证 】| 最新Web前端开发中级实操
2020-11-23 13:20:372020 12月 1+X Web 前端开发中级 模拟题大致就更这么多,我的重心不在这里,就不花太多时间在这里面了。但是,说说1+X Web前端开发等级考证这个证书,总有人跑到网上问:这个证书有没有用? 这个证书含金量高不高? # ... -
解决IDEA创建SpringBoot项目时没有web文件夹
2020-06-18 00:18:07【版权所有,文章允许转载,但须以链接方式注明源地址,否则追究法律责任】 原因 1.在这块他不是没有文件夹,idea后边把web改成Spring Web了,你就点击那个对勾就可以了 2.创建完项目之后发现没有WEB-INFO文件夹 ... -
Web端连接RabbitMQ
2018-11-13 11:06:56最近项目需要在Web端中后台应用中作为消费者连接RabbitMQ,以动态接收业务系统生成的最新数据。 RabbitMQ官方有nodejs库(http://www.rabbitmq.com/tutorials/tutorial-one-javascript.html),但经测试该库... -
CTFShow web1-7——CTF秀WEB模块解题思路
2021-09-14 21:26:28CTFShow WEB模块详细通关教程, 受篇幅所限, 通关教程分为上下两部分, 第一部分为1-7关, 第二部分为8-14关, 本篇博客为1-7关的通关教程, 从解题思路和所用到的知识点两个方面进行讲解 CTFShow web1-7关详细教程解题...