a标签嵌套href默认行为与子元素click事件存在影响

2018-08-07 Question about work 开发过程中遇到问题,简单写个demo 运行环境为Chrome 68 描述一下这个问题,当<a>标签内部存在嵌套时, 父元素<a>标签的href默认行为以及子元素绑定的click事件的响应之间存在影响.页面结构: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">…

父元素a标签的href默认行为以及子元素绑定的click事件的响应之间存在影响

原文地址背景开发过程中遇到问题,简单写个demo 运行环境为Chrome 68 描述一下这个问题,当a标签内部存在嵌套时, 父元素a标签的href默认行为以及子元素绑定的click事件的响应之间存在影响.页面结构: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" con…

子元素margin-top为何会影响父元素？

子元素margin-top为何会影响父元素? 引用地址:https://blog.csdn.net/sinat_27088253/article/details/52954688 2016年10月28日 11:25:38 阅读数:6944 问题如下一段很简单的代码: css如下: <style type="text/css"> *{ margin: 0px; padding: 0px; } .show{ margin: 0px auto; width: 200px; he…

jquery父元素和子元素点击事件传递问题_不可把父元素的事件传递给子元素_事件无限循环传递

前述:jquery中: 当一个元素的点击事件被触发时,会自动将该事件向父级元素逐级专递. 但是实际场景当中,我们可能会遇到需要在父级元素中定义点击事件,来触发特定子元素的点击事件,我就遇到了这么一个问题. 但是这么做的后果,在jquery1.8.2版本及以后所有版本(截止目前最新版本为3.3),会出现事件来回传递的问题,最终导致无限循环. 在jquery1.2.6版本中,子元素的点击传递给父元素时,再被父元素传递回来后,事件就不会再向外扩散了,也就是低级版本jquery只会向外扩散一次,但是在…

img标签不能直接作为body的子元素

前几天在一本教材上看到关于HTML标签嵌套规则一节的时候,看到这么一句话,“把图像作为body元素的子元素直接插入到页面中,这样是不妥的,一是结构嵌套有误,二是图像控制不方便.”后面还给了一段代码演示如下: 当时我很不理解,难道我这些年的做法都是错误的吗? 上网查了好多资料也没查出所以然,跟好友交流一下得到了以下结论: 1.首先人家说的不妥,并不是不能够,这意思并不是说img 不能放到body里面,而是对整体结构来说,这样子不好控制,最好在其之外加个div来控制图片的显示位置.大小等. 2.就是…

html5shiv主要解决IE6-8 无法识别HTML5的新标签，父节点不能包裹子元素，以及应用CSS样式

html5shivehtml5shiv主要IE6-8解决:1,HTML5提出的新的元素不被IE6-8识别.2,这些新元素不能作为父节点包裹子元素,3,并且不能应用CSS样式.让CSS 样式应用在未知元素上只需执行 document.createElement(elementName) 即可实现.<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">…

子元素的margin-top会影响父元素

---恢复内容开始--- 之前在写项目的时候,发现原本想让父子元素之间加点边距,却让父元素产生了margin-top,于是百度之后发现了原因. 在css2.1盒模型中 In this specification, the expression collapsing margins means that adjoining margins (no non-empty content, padding or border areas or clearance separate them) of tw…

3.5 spring-replaced-method 子元素的使用与解析

1.replaced-method 子元素方法替换: 可以在运行时用新的方法替换现有的方法,与之前的 look-up不同的是replace-method 不但可以动态地替换返回的实体bean,而且可以动态的更改原有方法的逻辑, 1.1.1使用实例: 首先创建一个Bean完成某项业务 public class Person { public void show() { System.out.println("I am Person .."); } } 在运营一段时间后需要改变原有的逻辑…

3.4 spring- lookup-method 子元素的使用与解析

1. lookup-method的应用: 1.1 子元素lookup-method 似乎不是很常用,但是在某些时候他的确是非常有用的属性,通常我们称它为 "获取器注入" . 引用 "Spring In Action " 中的一句话. '获取器注入是一种特殊的方法注入,它是把一个方法声明为返回某种类型的bean,但实际上,返回的bean是配置文件里面配置的,此方法可用在设计一些可插拔的功能上,解除程序依赖' 1.2 我们来看看具体的应用: 1.2.1 首先我们创建一个…

IE浏览器下a标签嵌套img标签默认带有边框

最近写在线主页时发现IE浏览器下a标签嵌套img标签默认带有边框: 解决办法:img{border:0 none;} 注意,严格意义上0和none都要加上!…

工作总结 a标签 <a href="/meetingtheme">Back to List</a> 返回上一级指向控制器默认Index @Html.ActionLink("Edit59", "Edit", new { id = item.ID }) 默认当前控制器

@Html.ActionLink("Back to List", "Index") ---- <a href="/doctorinfo">Back to List</a> 点击a标签跳到默认指向 meetingtheme/Index 因为路由默认指向控制器的 Index @Html.ActionLink("Edit", "Edit", new { id = item.I…

第153天：关于HTML标签嵌套的问题详解

HTML标签 1.块级元素 div.h1~h6.address.blockquote.center.dir.dl.dt.dd.fieldset.form.hr.isindex.menu.noframes.noscript.ol.p.pre.table.ul…… 特点:总是在新行上开始,高度.行高以及顶和底边距都可控制,宽度缺省的它的容器的100%,除非设定一个宽度. 功能:主要用来搭建网站构架.页面布局.承载内容. 2.行内元素 span.a.abbr.acronym.b.bdo.big.br.…

标签中href="javascript:;"表示什么意思？

1.标签的 href 属性用于指定超链接目标的 URL,href 属性的值可以是任何有效文档的相对或绝对 URL,包括片段标识符和 JavaScript 代码段. 2.javascript: 是一个伪协议,其他的伪协议还有 mail: tel: file: 等等. <a id="jsPswEdit" class="set-item" href="javascript:;">修改密码</a> javascript:是表示在触…

javascrip标签的href属性

1.标签的href属性用于指定超链接目标的URL.href属性的值可以是任何有效文档的相对或绝对URL,包括片段ID和javascript代码段. 2.javascript:这是一个虚假的协议.所谓的协议是电子邮件::文件:等等. “id=”jspswedit“class=”set in“href=”javascript“><a>1,modify password javascript:表示在默认动作中执行一段javascript代码,而javascript::表示执行,使其单击时没有响…

block、inline、inline-block区别以及标签嵌套

1.block 将元素转为块元素,块元素占一行,可以设置宽和高. 2.inline 将元素转为行内元素,占一行,不可以设置宽和高. 3.inline-block 将元素设置为行内块元素,这时元素既可以设置宽和高,又占一行.但这时的元素之间会出现缝隙,解决办法:1)设置浮动 2)将父元素的font-size设置为0,子元素设置为实际大小 4.常见的几种元素块级元素 :div.h系列.li.dt.dd.p 行内元素 :span.u.a..em.b.i.u.em 行内块元素:input .img…

HTML5标签嵌套规则

× 目录 [1]分类 [2]子元素 [3]总结前面的话在html5中,<a>元素的子元素可以是块级元素,这在以前是被认为不符合规则的.本文将详细介绍html5的标签嵌套规则分类 html5出现之前,经常把元素按照block.inline.inline-block来区分.在html5中,元素不再按照display属性来区分,而是按照内容模型来区分,分为元数据型(metadata content).区块型(sectioning content).标题型(heading content).文档…

Freemarker的初次使用之FTL标签嵌套与map的使用

入职第二周了,在熟悉了公司自动化测试脚本的编写(使用什么数据库,使用哪种语言,框架带了哪些方法)后,现在开始熟悉模拟器,我们把请求发到服务器1,服务器1根据请求参数处理后将结果发给模拟器,模拟器根据服务器1的处理结果再次调用脚本进行处理,然后将结果返回.我需要做的就是编写模拟器所调用的脚本.前两天使用的是SimpleTemplateEngine模版,进行简单的处理,然后周三的时候换成FreemarkerTemplate模版来进行处理. Freemarker这个我以前根本就没接触,赶紧从官网下载资…

a标签的href="javascript:void(0)"和href="#"的区别

修正一个说法上的bug吧.对于IE6来说,点击后gif暂停bug仅仅发生在“javascript:伪协议未加分号”的情形下. 我再来提供一个视角吧. 给<a>标签增加href属性,就意味着以下事情: :link选择器可以选择到它这个a标签可以获得焦点(可以通过tab按键访问到) 在浏览器的默认样式表中,有href属性的<a>标签才有cursor:pointer的效果(尤其是在低版本的IE上). 绑定了onclick事件的<a>标签,尤其是它的作用是ajax请求时,基本…

当fixed元素相互嵌套时chrome下父元素会影响子元素的层叠关系

问题:fixed元素被另一个fixed元素包含的时候在chrome下fixed子元素的定位会受到父元素的影响. demo(http://jsbin.com/qumah/1): <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>JS Bin</title> <style> .fixed { position: fixed; left:0…

Html A标签中 href 和 onclick用法、区别、优先级别

原文:Html A标签中 href 和 onclick用法.区别.优先级别如果不设置 href属性在IE6下面会不响应hover.双击后会选中标签的父容器而非这个一a标签(IE下都存在这一问题). 代码如下复制代码 <a href="javascirpt:fn(this)"> <a onclick="fn(this)"> 假定我们有个fn方法,需要取到这个元素,第一个方法传入的this是空值. 所以,比较推荐的写法是代码如下复制代…

riot.js教程【五】标签嵌套、命名元素、事件、标签条件

前文回顾 riot.js教程[四]Mixins.HTML内嵌表达式 riot.js教程[三]访问DOM元素.使用jquery.mount输入参数.riotjs标签的生命周期: riot.js教程[二]组件撰写准则.预处理器.标签样式和装配方法: riot.js教程[一]简介: 标签嵌套让我们定义一个父标签account,一个子标签subscription <account> <subscription plan={ opts.plan } show_details="true…

a标签嵌套解决方案

在实际网页布局之中,我们有时候需要一整块点击区域中间还要有部分按钮点击,也就是需要a标签嵌套a标签,如下: <a href="#haorooms">outerA <a href="#haoroomsinner">innerA</a></a> 但是我们会发现,这种嵌套,浏览器会直接错误解析,解析结果如下: <!-- 而浏览器则会解析成 -- > <a h…

a标签嵌套a标签在实际项目开发中遇到的坑

大家都知道HTML的嵌套规范,其中一个规范是块元素嵌套行内元素,块元素嵌套块元素,行内元素嵌套行内元素,行内元素不能嵌套块元素. 其中需要注意的是行内元素嵌套行内元素,a标签虽然是行内元素,但是a标签是不能嵌套a标签的,以前也没注意,结果不小心用了a标签嵌套a标签以后出现了以下的一个问题. 我想把二级显示变成三级显示,如下图红色框部分是我增加三级显示的html代码审查元素发现:我新增加的那个div(上图红色框的部分)莫名会增加一个a元素,这个增加的a元素是我新增加的div的父元素这始终另我…

转：前端页面a标签嵌套a标签效果的两种解决方案

这是由工作中的一个小改动需求得到的这个解决方案的:那个需求是这样的,如图: 需求原来是球队名字没有点击功能的,而蓝色方框两队之间的比赛点击的时候会跳转到比赛文字直播页面.现在需要要求点击球队名字要跳转到球队资料库页面. 这样就会产生了a标签的嵌套. 但是总所周知a标签是内联元素(inline element),如果嵌套a标签的话浏览器则会解析成:  <a href="#outer">outerA <a href=&…

前端 HTML 标签嵌套规则

标签嵌套规则块元素可以包含内联元素或某些块元素,但内联元素却不能包含块元素,它只能包含其它的内联元素,例如: <div><div></div><h1></h1><p></p></div> ✔️ <a href=”#”><span></span></a> ✔️ <span><div></div></span> ❌ 块…

关于HTML标签嵌套的问题详解

先说基础,HTML标签有两类: 1.块级元素 div.h1~h6.address.blockquote.center.dir.dl.dt.dd.fieldset.form.hr.isindex.menu.noframes.noscript.ol.p.pre.table.ul…… 特点:总是在新行上开始,高度.行高以及顶和底边距都可控制,宽度缺省的它的容器的100%,除非设定一个宽度. 功能:主要用来搭建网站构架.页面布局.承载内容. 2.行内元素 span.a.abbr.acronym.b.bd…