html a标签包含a标签,浏览器的行为处理
a标签包含a标签
浏览器可能是为了避免a的转跳重复,所以禁止了a标签包含a标签,如何你的代码中有a标签包含a标签,那么浏览器将会重新编码外层a标签,取外层a标签与内层a标签的差集,加上外层a标签,并把外层a标签去掉。这样就会破坏我们的html结构。
因此我编码的时候一定要避免a标签包含a标签
我这次重构代码的时候遇到了这样的代码,但是html结构我并不想修改他的。
我思路是:
一、用div对外层a标签进行模拟
二、用div对内层a标签进行模拟
模拟用的div用点击事件截获,最后创建a标签执行a标签的默认方法
// 这是我对外层a标签进行模拟用的代码
function div_a_click(e){
var target_elem = e.target || e.srcElement;
var a_tag_RegExp = /[^http://|^https:\/\/][\s\S]*/;
while(!(target_elem === this || target_elem.tagName == 'BODY')){
if (target_elem.tagName == 'A' && a_tag_RegExp.test(target_elem.href)) {
return;
}
target_elem = target_elem.parentNode;
}
var a = document.createElement('a');
a.href = this.getAttribute('href');
a.target = target_elem.getAttribute('target');
target_elem.parentNode.appendChild(a);
a.click();
target_elem.parentNode.removeChild(a);
}
html a标签包含a标签,浏览器的行为处理的更多相关文章
- 面试小记---外部脚本必须包含 <script> 标签吗?
外部脚本必须包含 <script> 标签吗? 答案是否定的. 身为小白的我一开始也是以为这句话的对了,因为本来嘛,引用外部脚本不都用的是<script>标签中的src属性吗.所 ...
- GZip压缩的js文件IE6下面不能包含<script>标签
IE6下面,GZip压缩的js文件,如果js中包含<script>标签,一遇到这样的标签,后面的内容居然都截断了,狂晕! 花了我一个晚上来找原因.. 需要将字符串'<script&g ...
- 从a标签为什么不能包含div标签-了解HTML5元素分类与内容模型
我们知道按新的 HTML 规范,已经不按 inline 和 block 来区分元素类型了.所以我们在a标签里面使用div标签时候会发现a标签并不能通过改变css盒子模型的方式将div元素包含. 元素分 ...
- 解决json包含html标签无法显示的问题
要是在json中包含html标签的话,在js接收数据的时候就会出现问题,导致接收失败. 所以在java端,对json包含有html标签的句子先进行转义. package com.alibaba.int ...
- PHP & Javascript 如何对字符串中包含html标签进行编码 整理
为什么要对字符串编码? 某些字符串中包含html标签,不编码,页面输出就乱了. PHP下怎么对字符串编码? htmlentities vs htmlspecialchars htmlentities ...
- IE浏览器下a标签嵌套img标签默认带有边框
最近写在线主页时发现IE浏览器下a标签嵌套img标签默认带有边框: 解决办法:img{border:0 none;} 注意,严格意义上0和none都要加上!
- 整个Html内容以邮件的方式发送出去(取出标签包含的用户输入信息)
需求是一个html的调查问卷,在调查问卷完成后,将问卷页面(包括用户填写的答案)完整的发送给领导. 问题出现了 填写的时候用的是jquery赋值的方法 ,比如text文本.textrear用的是val ...
- 点击显示子菜单,离开隐藏子菜单(onmouseout下包含a标签的js解决方法)
<div class="menu"> <a href="javascript:void(0);" id="a_all&quo ...
- a标签包含块级元素问题
a标签包含块级元素是不符合W3c标准的,但是淘宝也有这样的布局暂且认为可以这样(有时候布局需要这样写) 当a标签包含了div这样的块级元素时a标签是要转换成块级元素的使用display:block.但 ...
随机推荐
- python中文注释报错问题
错误信息: SyntaxError: Non-ASCII character '\xe4' in file... 解决办法: 在文件第一行或第二行添加:# -*- coding: utf-8 -*- ...
- day1 初识Linux
linux 基础 1.Linux简介1) 掌握Linux的定义:Linux是一套免费使用和自由传播的类Unix操作系统,是一个基于POSIX和UNIX的多用户.多任务.支持多线程和多CPU的操作系统. ...
- <五>JDBC_利用反射及JDBC元数据编写通用的查询方法
此类针对javaBean类写了一个通用的查询方法,List<javaBean> 通用查询更新中...:通过学习,深刻体会到学会反射就等于掌握了java基础的半壁江山! 一.使用JDBC驱动 ...
- 自定义一个字母Button
package com.example.administrator.yunstore.widget; import android.content.Context; import android.gr ...
- Python之路第一课Day3--随堂笔记(文件操作)
一.集合的介绍 1.集合操作 集合是一个无序的,不重复的数据组合,它的主要作用如下: 去重,把一个列表变成集合,就自动去重了 关系测试,测试两组数据之前的交集.差集.并集等关系 常用操作 s = se ...
- 第一章-第三题(目前流行的源程序版本管理软件和项目管理软件优缺点)--By梁旭晖
引用自:http://www.cnblogs.com/WJ1234/p/5285595.htmlhttp://blog.163.com/yuyang_tech/blog/static/21605008 ...
- POMDP
本文转自:http://www.pomdp.org/ 一.Background on POMDPs We assume that the reader is familiar with the val ...
- [译] jQuery 3 有哪些新东西
转自:https://github.com/cssmagic/blog/issues/59 jQuery 的横空出世,至今已有十个年头了,而它的长盛不衰显然不是没有理由的.jQuery 提供了极为友好 ...
- 掌握Thinkphp3.2.0----CURD
TP-----CURD create()创建数据----整理数据 在数据库添加等操作之前,我们首先需要对数据进行创建.何为数据创建,就是接受提交过来的数据,比如表单提交的 POST(默认)数据.接受 ...
- 给Source Insight做个外挂系列之三--构建外挂软件的定制代码框架
上一篇文章介绍了“TabSiPlus”是如何进行代码注入的,本篇将介绍如何构建一个外挂软件最重要的部分,也就是为其扩展功能的定制代码.本文前面提到过,由于windows进程管理的限制,扩展代码必须以动 ...