首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

关于拖拽功能在IE11 、Firefox和Safari兼容问题

) 3是firefox在拖动时候会打开一个新窗口 (firbox) 4是ie11不支持onclick属性方法 ; ie11 里元素对象attributes排序和其他浏览器不同, ie11 ...remove()方法work (ie) 对于原因1解决方案 其中IE11 压根就不支持path属性,firefox和Safari还勉强通过hack方式获取到path,获取方式如下: const...对于原因2解决方案 IE11, firefox 都有dataTransfer.setData问题, Safari没有可以不用管。...('click', function () {}) 如果你业务代码里包含 获取对象attributes代码,比如 event.target.attributes[n].xxx 在ie11attributes...解决这个问题 ,我是通过遍历attributes 找到符合我要代替之前写死attributes顺序 针对ie11 remove()work情况,可以用代码 parent.removeChild

3.3K30
您找到你想要的搜索结果了吗?
是的
没有找到

JS相关概念

1、CSS和JS在网页放置顺序是怎样? (1)CSS 对于谷歌浏览器和Safari放在head里body里都一样。因为它是在全部样式表完全加载下来之后才开始渲染页面,将内容呈现在页面上。...对于Firefox,head标签行为与Chrome/Safari完全一致,这些link标签全部加载完成之前,页面上不显示内容。...而body标签则不阻塞任何内容显示,会出现FOUC无样式内容闪烁。 对于IE/Edge。...而IE、Chrome、Safari则是在全部样式表完全加载下来之后才开始渲染页面样式将内容呈现在页面上,没下载完之前页面是空白。...这样做也同样是有利有弊:利在于可以避免 Firefox、Opera中出现闪烁问题(虽然在IE下闪烁是经常事情),可以确保样式会统一解析并渲染页面;而弊端在于页面全部样式表加载延迟了页面渲染时间

1.6K20

高性能网站建设指南-前端性能优化(二)

规则6:将样式表放在顶部 ​ 将DHTML特征样式表放在文档顶部Head首先下载它们能使页面呈现得更快。 无样式内容闪烁 ​ 白屏现象源自浏览器行为。...样式表在页面位置并不影响下载时间,但是会影响页面的呈现。 如果样式表仍在加载,构建呈现树就是一种浪费,因为在所有样式表加载并解析完毕之前无需绘制任何东西。...IE通常会白屏,Firefox等会其他浏览器会闪烁(逐步呈现)。...避免白屏和闪烁: @import url()会导致组件下载时无序性,使用Link标签代理会带来性能上收益; 如果样式表不是呈现页面所必需,可以想办法再文档加载完后动态加载; 可视化回馈重要性:(...减少HTTP请求 使用内容发布网络CDN 为组件添加长久Max-AgeExpires头 自定义ETage移除ETag 压缩脚本和样式表 将JavaScript和CSS放到外部文件,并确保脚本仅被包含一次

2K21

HTML和CSS面试题及答案总结一

3)兼容性差别:@import在老浏览器上兼容,只有在IE5以上浏览器才可以被识别,但是link可以在任意浏览器版本上进行加载执行。...3) 第三种是外部样式表,通过link标签或者是在style通过@import方式引入外部CSS样式文件。...3)书写顺序不同,内联样式表写在标签当中,内部样式表写在style标签来链入内部CSS文件,外部样式表是通过link或者是@import方式来链入外部CSS文件。...在标准模式,浏览器根据规范呈现页面;在混杂模式,页面以一种比较宽松向后兼容方式显示。...答: HTML5基于SGML(Standard Generalized Markup Language 标准通用标记语言),因此不需要对DTD(DTD 文档类型定义)进行引用,但是需要DOCTYPE

1.2K10

HTML 面试知识点总结

告知浏览器解析器用什么文档标准解析这个文档。 DOCTYPE 不存在格式不正确会导致文档以兼容模式呈现。 回答(参考1-5): <!...link 标签 rel 属性定义了当前文档与被链接文档之间关系。常见 stylesheet 指的是定义一个外部加载样式表。 12....(浏览器解析过程) 理论上,既然样式表不改变 DOM 树,也就没有必要停下文档解析等待它们,然而,存在一个问题,JavaScript 脚本执行时可 能在文档解析过程请求样式信息,如果样式还没有加载和解析...(浏览器渲染过程) FOUC:主要指的是样式闪烁问题,由于浏览器渲染机制(比如firefox),在 CSS 加载之前,先呈现了 HTML,就会导致展示 出无样式内容,然后样式突然呈现现象。...(2)动态排版样式(Dynamic Style Sheets):W3C CSS 样式表提供了设定 HTML 标记字体大小、字形、样式、粗细、 文字颜色、行高度、加底线加中间横线、缩排、与边缘距离

1.9K20

Web前端最全面试宝典- CSS篇

display:inline-block 简单来说就是将对象呈现为inline对象,但是对象内容作为block对象呈现。之后内联对象会被排列在同一行内。...1)优先级就近原则,同权重情况下样式定义最近者为准; 2)载入样式以最后载入定位为准; 优先级为: 同权重: 内联样式表(标签内部)> 嵌入样式表(当前文件)> 外部样式表(外部文件)。 !...(这个符号只有ie6会识别) 渐进识别的方式,从总体逐渐排除局部。 首先,巧妙使用“\9”这一标记,将IE游览器从所有情况中分离出来。...css 5)IE下,可以使用获取常规属性方法来获取自定义属性, 也可以使用getAttribute()获取自定义属性; Firefox下,只能使用getAttribute()获取自定义属性。...,相关样式表样式规则会按照正常级联规被应用。

1K10

HTML(一)

HTML(一) 發佈於 2018-06-14 从这篇开始,通过几篇介绍,了解常用 HTML 标记,熟悉每个标签在浏览器默认样式。...而 HTML 5 基于 SGML,因此不需要对 DTD 进行引用,并且 HTML5 !doctype 是区分大小写。 所以在现代 HTML5 规范规定: 仅需要在最前面声明 !...文档模式 现代浏览器需要不同模式,既要呈现久远 HTML 界面,不至于界面结构混乱不堪,也需要呈现 W3C 标准界面: 标准显示方式就是 – -标准模式(strict) 标准显示方式 —...default-style: 指定页面优先使用样式表,content属性值必须是同一文档某个style元素link元素title属性值。...载入外部样式表 为页面定义网站标志 <link rel="shortcut icon

44050

【前端】Web前端学习笔记【2】

缺点:IE不支持、不能实现数据持久保存。 globalStorage 使用于Firefox2+火狐浏览器,类似于IEuserData。 缺点:IE不支持。...localStorage localStorage是Web Storage互联网存储规范一部分,现在在Firefox 3.5、Safari 4和IE8得到支持。 缺点:低版本浏览器不支持。...CSS link 和 @import 区别 ---- link属于HTML标签,而@import是CSS提供; 页面被加载时,link会同时被加载,而@import引用CSS会等到页面被加载完再加载...; @import只在IE5以上才能识别,而link是HTML标签,无兼容问题; link方式样式权重 高于@import权重. ---- 10....对布局所有东西进行浮动,然后使用适当有意义元素(常常是站点页脚)对这些浮动进行清理。(这有助于减少消除不必要标记。) ---- 13. new操作符具体干了什么呢?

17920

【FE前端学习】第二阶段任务-基础

标记标签是用尖括号包围关键词,以开始标签和结束标签成对存在,如和 HTML属性,给元素提供了更多信息,在开始标签以名称/值形式出现,如下例href属性 <a href="http...HTML编辑器,推荐使用Notepad (PC) <em>或</em> TextEdit (Mac)简单<em>的</em>文本编辑器 HTML样式 内部<em>样式表</em> 外部<em>样式表</em> 常用来连接外部<em>样式表</em> 用于定义样式信息 <...position 把元素放置到一个静态<em>的</em>、相对<em>的</em>、绝对<em>的</em>、<em>或</em>固定<em>的</em>位置<em>中</em>。 visibility 设置元素是否可见<em>或</em>不可见。...HTML 元素选取和操作 text() - 设置<em>或</em>返回所选元素<em>的</em>文本内容 html() - 设置<em>或</em>返回所选元素<em>的</em>内容(包括 HTML <em>标记</em>) val() - 设置<em>或</em>返回表单字段<em>的</em>值 attr() 方法用于获取属性值

5.1K10

浏览器工作原理

遗憾是,我们不得不处理很多格式错误 HTML 文档,所以解析器必须具备一定容错性。 我们至少要能够处理以下错误情况: 明显不能在某些外部标记添加元素。...为了与 IEFirefox 兼容,Webkit 将其与  做同样处理。    ...以 Firefox 为例,用户可以将自己喜欢样式表放在“Firefox Profile”文件夹下)。   ...1)样式表层叠顺序   某个样式属性声明可能会出现在多个样式表,也可能在同一个样式表中出现多次。这意味着应用规则顺序极为重要。这称为“层叠”顺序。...Firefox 对此过程进行了优化,也就是添加隐藏元素,例如被不透明元素完全遮挡住元素。

3K40

爬虫基础(二)——网页

如下 HTML HTML含义   与超文本相对是线性文本。线性,即直线关系,成比例。一本书,从第一页到最后一页,呈现直线关系;一本书书签,从第一章转跳至第十章,呈现是非线性关系。...HTML(HyperText Mark-up Language):超文本标记语言 超文本:HyperText,用超链接方法,将不同空间文字信息组织在一起网状文本 链接:link,从一个文档指向其它文档从文本锚点...代码如下: CSS构造样式规则   样式表包含了定义网页外观规则,样式表每条规则都有两个主要部分...ajax   Ajax是一种无需刷新页面即可从服务器(客户端)上加载数据手段,这里刷新是指重新请求,重新下载页面。而Ajax却可以在刷新情况下加载数据,从而给人一种“流畅”感觉。...+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5

1.9K30

h5新功能data-*,好好利用,还能做数据双向绑定

DOM元素任意属性(比如class等,甚至非W3C标准属性也支持,不过推荐这么做)所以很方便凑一些模版文字。...CSSStyleSheet是浏览器存放页面内所有css样式表对象方法(不包括行内样式),每个link和style标签都代表一个CSSStyleSheet对象,获取他们可以用document.styleSheets...(需要注意是虽然styleSheets方法返回结果把link标签引进外部样式也算进去了,但是非IE浏览器没办法获取到他们cssRules属性,只有内嵌style标签内元素可以被获取到) document.styleSheets...'这种写法在chrome和IE下都行得通,但是firefox会返回'undefined',所以建议还是使用index值来获取stylesheet */ .insertRule语法是stylesheet.insertRule...(rule, index),另一个参数是index,意思是在对应styleSheets里cssRules样式表位置,这个值越大则样式优先级越高,但是值不能超过当前样式表规则(cssRules)长度

1.8K40

HTML+CSS 面试题整理(一)

3提供4种DOCTYPE声明;使用XHTML 1.0提供3种DOCTYPE声明 ②怪异模式:浏览器不能识别的DOCTYPE声明;在DOCTYPE声明,不适用DTD声明使用HTML 4(不包括HTML...增加内边距、边框和外边距不会影响内容区域尺寸,但是会增加元素框总尺寸) ---- 7.css引入样式表方式有: ①外部样式表 <link rel="stylesheet" type="...IE5以上才能识别,link所有都可以 ④js控制dom修改样式只能使用link标签 ⑤@import可以在css再次引入其它样式表 ---- 8. css选择符(w3school): ⑴标签选择符...important 优先级最高,若出现冲突则比较 四位数 ②优先级相同时,采用就近原则 ③继承得来属性,其优先级最低 ---- 11.网页分成三个层次: ①结构层:由HTMLXHTML之类标记语言负责创建....} ---- 13.常用浏览器及其内核: ①Trident内核(IE内核):IE ②webkit内核:chrome、Safari ③Gecko内核(火狐内核):Mozilla firefox(火狐浏览器

1.1K80
领券