博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
a链接易混淆与form表单简易验证用法详解
阅读量:5136 次
发布时间:2019-06-13

本文共 1078 字,大约阅读时间需要 3 分钟。

链接可以说遍布互联网,比如你想提供一个可以跳转到百度首页的链接给网友,那么代码如下:

而如果这个链接指向的网址你想在浏览器中的新窗口中打开,那么代码如下:

那如果我页面中有一堆的a链接都想在新窗口中打开呢?难道得为一个个链接添加 target="_blank" ?其实只需在页面中插入一个base标签就可以实现了,base标签一般是放到网页的head标签里面,base标签的代码如下:

下面区分下a链接容易混淆的知识点:

这三种其实是有区别的,第一种空链接点击后会刷新页面,而后面两种写法点击后不会刷新页面;

但是但是但是,第二种写法#链接其实还有一个独特的用法,比如以下代码:

这是一个#链接....此处省略很多页面内容....
这是页面底部

如果一个页面内容很长,我们想在页面头部设置一个链接方便用户点击后直接跳转到当前页面的底部浏览就可以使用上面的写法来实现了,注意 href="#foot"  与  id="foot"  中的foot必须一致否则无效。

 

 下面来个问题:

你觉得哪个的js代码会执行呢? 其实onclick的alert会先被执行。

注意onclick的'javascript:'可以省略不写,而href属性执行js代码时的'javascript:'不能省略。

下面来谈谈a链接调用函数易混淆的地方:

这是链接一    这是链接二    这是链接三    这是链接四    这是链接五    

上面的script代码段其实写到a链接的前面或后面都可以正常运行,因为js有 预解析机制。

链接一点击后:先弹2后弹1

链接二点击后:先弹2后弹1

链接三点击后:onclick事件触发后直接return false(程序返回假),后面的代码统统不执行,所以啥也没弹

链接四点击后:弹2然后没有然后了

链接五点击后:弹2然后没有然后了,其实链接五与链接四效果一模一样。

 

举一反三:其实form表单中的action(类似a链接里面的href)与onsubmit(类似onclick)写法类似。

 

 

 

 

转载于:https://www.cnblogs.com/jewave/p/5936899.html

你可能感兴趣的文章
window10设置文件的默认打开方式
查看>>
SQLiteOpenHelper 升级onUpgrade 的调用问题
查看>>
MVC 服务器文件下载
查看>>
CodeForces 484B 数学 Maximum Value
查看>>
『编程题全队』Beta 阶段冲刺博客五
查看>>
类AudioTrack的函数getMinFrameCount(java侧为getMinBufferSize)
查看>>
Default Parameter Values in Python
查看>>
JavaScript 基础,登录前端验证
查看>>
jsp内置对象-application对象
查看>>
图 -数据结构(C语言实现)
查看>>
Swift协议中类继承协议的mutating问题
查看>>
ie与火狐中常见的一些兼容问题
查看>>
深入理解java虚拟机(六)字节码指令简介
查看>>
java中Collection和Collections的区别
查看>>
设计模式系列 - 责任链模式
查看>>
第一天站立会议
查看>>
博客整理
查看>>
DECLARE_MESSAGE_MAP用法
查看>>
cookie
查看>>
颜色直方图
查看>>