background-image:url为空引发的两次请求问题
参考文章: https://blog.csdn.net/jsjhushilei/article/details/51101014
1.Nicholas 在 2009 年就开始推动各浏览器厂商,现在看起来就 IE 修复得还可以,Firefox 依旧会从本地缓存中读取一次(重复读取有可能会导致 js/css 的再次 parse + execute,浪费呀)。对于#值,则目前所有浏览器都未考虑周全。
改变代码习惯。严禁代码中,url/href/src 值为空或 # . 这应该是目前最好的一种方式。
经验教训:对于开放 CSS 的系统,源码检查时,要加入对 background/background-image: url()/url(#) 的检查。
2.避免空链接属性空的链接属性是指img、link、script、ifrrame元素的src或href属性被设置了,但是属性却为空。如,我们创建了一个图片,并且暂时设置图片的地址为空,希望在未来动态的去修改它。但是即使图片的地址为空,浏览器依旧会以默认的规则去请求空地址:
Internet Explorer 8及以下版本浏览器只在img类型元素上出现问题,IE会把img的空地址解析为当前页面地址的目录地址。例如:如果当前页面地址为http://example.com/dir/page.html,IE会把空地址解析为http://example.com/dir/地址并请求。
早些版本的Webkit内核浏览器 与Firefox 会把空地址解析为当前页面的地址。如果页面内有多个空链接属性元素,当前页面的服务器则会被请求多次,增加服务器的负载。相较桌面浏览器对内核的更新升级较积极,这个问题在ios与android系统的移动浏览器上问题可能较严重。
幸运的是所有主流浏览器面对iframe的src属性为空时,会把空地址解析为about:blank地址,而不会向服务器发出额外的请求。
经过一番调查,最终发现该问题链接或者url其实在开发中会出现取变量值得情况,因此就避免不了出现空的情况,可以用about:blank来代替空的情况。
————————————————
版权声明:本文为CSDN博主「jsjhushilei」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/jsjhushilei/article/details/51101014
background-image:url为空引发的两次请求问题的更多相关文章
- img标签src=""和background-image:url();引发两次请求页面bug
img标签src=""和background-image:url();引发两次请求页面bug 具体原因是,在img 对象的src 属性是空字符串("")的时 ...
- vue动态绑定background:url绑不上的问题
场景: 利用swipper做轮播图,在联调的时候发现有些图片存在有些图片不存在 原因:图片路径中存在 (),和 background:url() 会冲突 解决方法: 一:oss图片路径避免出现括号 ( ...
- ajax发送请求的时候url为空或者undefined会发生什么
$.ajax()里的url为空,ajax请求发送到当前自己的页面. 例如index.html里$.ajax()的url为空就发送到index.html
- 用vue的抽象组件来做一个防止img标签url为空或url地址出错的验证
看了网上文章学习了下vue的抽象组件,感觉就跟react的高阶组件一样的使用场景,只是更加面向vue的底层编程 ,网上介绍的抽象组件一般有2种用法,1 用来加防抖和节流 2 用来控制按钮是否允许点击做 ...
- jquery table 发送两次请求 解惑
版本1.10 以下链接为一个较低版本解决方案: http://blog.csdn.net/anmo/article/details/17083125 而我的情况有点作, 情况描述: 1,一个页面两个t ...
- Ajax中的get和post两种请求方式的异同
Ajax中我们经常用到get和post请求.那么什么时候用get请求,什么时候用post方式请求呢? 在做回答前我们首先要了解get和post的区别. 1. get是把参数数据队列加到提交表单的A ...
- Ajax的get和post两种请求方式区别
Ajax的get和post两种请求方式区别 (摘录):http://ip-10000.blog.sohu.com/114437748.html 解get和post的区别. 1. get是把参数数据队列 ...
- .net中对HTTP请求的两种请求:Get和Post的操作
.net中对HTTP请求的简单操作总结 第一部分,HTTP协议的简单了解 一. 什么是HTTP协议 超文本传输协议 (HTTP-Hypertext transfer protoco ...
- vue使用axios发送请求,都会发送两次请求
vue 使用axios,每次的请求都会发送两次,第一次的请求头为options CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sha ...
随机推荐
- php7.4 更新特性
PHP 7.4.0 Released! The PHP development team announces the immediate availability of PHP 7.4.0. This ...
- 打开nginx配置的站点报错500
打开站点报错500的原因 有很多,这里只说明一点:nginx 的fastcgi.conf配置引起的问题 环境说明 1 站点目录结构 wwwroot website public application ...
- Git 更新
在向远程仓库推送之前,为避免冲突,通常会先从远程仓库更新,再添加文件,再commit到staging area,最近push. 更新使用命令git pull 1 2 3 4 5 6 7 8 9 10 ...
- Git_从远程branch取回所有最新代码,暴力覆盖本地 && GIT基本结构
假设你本地有一个xx分支对应着远端的xx分支,当前,你在本地的xx分支进行了修改(可以是执行了add, commit,但不要push),然后,现在想从远端的xx分支拿到最新的代码,可以用下图方法覆盖掉 ...
- 对JavaEE的简单理解
本文是在学习软件工程与J2EE课程时的学习笔记,旨在从大体的概念上了解Java EE的一些主要组件在Web应用中的作用. 上图精炼的描述了MVC模型以及Java EE的部分组件如何分布在一个Web应用 ...
- Flask源码之:路由加载
路由加载整体思路: 1. 将 url = /index 和 methods = [GET,POST] 和 endpoint = "index"封装到Rule对象 2. 将Ru ...
- Linux基础(08)信号通信机制
1.Linux中的信号(有32个) 信号会中断一些函数的阻塞 https://zhidao.baidu.com/question/1766690354480323100.html #define S ...
- LOJ #3103. 「JSOI2019」节日庆典
题意 给定字符串 \(S\) ,对于 \(S\) 的每个前缀 \(T\) 求 \(T\) 所有循环同构串的字典序最小的串,输出其起始下标.(如有多个输出最靠前的) \(|S| \le 3 \times ...
- mysql 删除表中多余的重复记录
=============================================== 2019/7/16_第1次修改 ccb_warlock == ...
- python-tyoira基本
目录 .Typora安装 我们在之前的时候记录笔记就是使用word和记事本,但是从今天开始我们要更换软件,记录笔记使用Typora软件,为什么要使用Typora的软件呢,是因为我们程序员不只是写代码这 ...