参考文章: 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为空引发的两次请求问题的更多相关文章

  1. img标签src=""和background-image:url();引发两次请求页面bug

      img标签src=""和background-image:url();引发两次请求页面bug 具体原因是,在img 对象的src 属性是空字符串("")的时 ...

  2. vue动态绑定background:url绑不上的问题

    场景: 利用swipper做轮播图,在联调的时候发现有些图片存在有些图片不存在 原因:图片路径中存在 (),和 background:url() 会冲突 解决方法: 一:oss图片路径避免出现括号 ( ...

  3. ajax发送请求的时候url为空或者undefined会发生什么

    $.ajax()里的url为空,ajax请求发送到当前自己的页面. 例如index.html里$.ajax()的url为空就发送到index.html

  4. 用vue的抽象组件来做一个防止img标签url为空或url地址出错的验证

    看了网上文章学习了下vue的抽象组件,感觉就跟react的高阶组件一样的使用场景,只是更加面向vue的底层编程 ,网上介绍的抽象组件一般有2种用法,1 用来加防抖和节流 2 用来控制按钮是否允许点击做 ...

  5. jquery table 发送两次请求 解惑

    版本1.10 以下链接为一个较低版本解决方案: http://blog.csdn.net/anmo/article/details/17083125 而我的情况有点作, 情况描述: 1,一个页面两个t ...

  6. Ajax中的get和post两种请求方式的异同

    Ajax中我们经常用到get和post请求.那么什么时候用get请求,什么时候用post方式请求呢? 在做回答前我们首先要了解get和post的区别.   1. get是把参数数据队列加到提交表单的A ...

  7. Ajax的get和post两种请求方式区别

    Ajax的get和post两种请求方式区别 (摘录):http://ip-10000.blog.sohu.com/114437748.html 解get和post的区别. 1. get是把参数数据队列 ...

  8. .net中对HTTP请求的两种请求:Get和Post的操作

    .net中对HTTP请求的简单操作总结 第一部分,HTTP协议的简单了解 一.           什么是HTTP协议 超文本传输协议 (HTTP-Hypertext transfer protoco ...

  9. vue使用axios发送请求,都会发送两次请求

    vue 使用axios,每次的请求都会发送两次,第一次的请求头为options CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sha ...

随机推荐

  1. 配置SSH无密码登录【原著】

    环境:两台Centos虚拟机,配置了静态的ip.(详见虚拟机如何配置静态的IP地址的操作步骤) 192.168.75.21192.168.75.22 第一步:为每台服务器配置静态IP地址参见: 虚拟机 ...

  2. Appium 环境配置(sdk)

    1,jdk环境配置 参见jdk环境配置:https://www.cnblogs.com/changpuyi/p/8659545.html 2,sdk环境的配置 前提已经下载,解压adt-bundle- ...

  3. 在ensp上实现ospf与acl综合应用实例

    acl命令主要是进行控制 我们搭建一下拓扑图 实验内容 分析:1.我们需要规划多个ospf域 2.财务和研发部所在的区域不受其他区域链路不稳定性影响 3.在R1,R2,R3上设置acl规则,限制只有I ...

  4. Highcharts 宽度溢出容器

    1,设置Highcharts的动态宽高. 获取Highcharts图表需要的宽高值,给到Highcharts图表的div容器. 如:var hpvCountSendDateHei = $(" ...

  5. 前端框架之Bootstrap框架

    下载地址:https://v3.bootcss.com/,下载Bootstrap3版本 下载之后把文件中不需要的文件都删掉 需要获取的样式代码,可以直接从这些地方找到,然后复制 一.HTML页面导入文 ...

  6. Python之路【第十一篇】:Python面向对象之封装

    一 引子 从封装本身的意思去理解,封装就好像是拿来一个麻袋,把青菜,土豆,花菜,还有苹果一起装进麻袋,然后把麻袋封上口子.照这种逻辑看,封装=‘隐藏’,这种理解是相当片面的. 在面向对象中这个麻袋就是 ...

  7. 【LeetCode】 #7:反转整数 C语言

    目录 题目 思路 初步想法 进一步想法 总结 最近打算练习写代码的能力,所以从简单题开始做. 大部分还是用C语言来解决. @(解法) 题目 给出一个 32 位的有符号整数,你需要将这个整数中每位上的数 ...

  8. 7. Spark SQL的运行原理

    7.1 Spark SQL运行架构 Spark SQL对SQL语句的处理和关系型数据库类似,即词法/语法解析.绑定.优化.执行.Spark SQL会先将SQL语句解析成一棵树,然后使用规则(Rule) ...

  9. pytest_使用自定义标记mark

    前言 pytest可以支持自定义标记,自定义标记可以把一个web项目划分多个模块,然后指定模块名称执行.app自动化的时候,如果想android和ios公用一套代码时,也可以使用标记功能,标明哪些是i ...

  10. python内存机制与垃圾回收、调优手段

    目录 一.python的内存机制 二.python的垃圾回收 1. 引用计数 1.1 原理: 1.2 优缺点: 1.4 两种情况: 2. 标记清除 2.1 原理: 2.2 优缺点: 3. 分代回收 3 ...