Bootstrap中data-src无法显示图片,但是src可以

Bootstrap中data-src无法显示图片,但是src可以

在学习bootstrap时,书中的源码是用的data-src来定义图像位置,但是我在使用的时候无法显示图片;data-src可以在img标签中使用来显示图片吗?我使用src可以,而是用data-src不可以。书上的源码:


class="thumbnail"> <<span class="hljs-name">img data-src="图片地址" alt="..."> <<span class="hljs-name">div class="caption"> <<span class=”hljs-name”>h3>Thumbnail label </<span class=”hljs-name”>h3> <<span class=”hljs-name”>p>… </<span class=”hljs-name”>p> <<span class=”hljs-name”>p> <<span class=”hljs-name”>a href= “#” class= “btn btn-primary”>Action </<span class=”hljs-name”>a> <<span class=”hljs-name”>a href= “#” class= “btn btn-default”>Action </<span class=”hljs-name”>a> </<span class=”hljs-name”>p> </<span class=”hljs-name”>div> </<span class=”hljs-name”>div>

本来就是src的才会显示。data-src只是注意储存的,比如做懒加载的时候就可以把真实的url先写到这个属性里面

用来做动态延迟加载的,就是懒加载的

那开始的时候索性src也别用。用其他的比如src1。
然后对遍历所有的img标签,如果有data-src的,将其值赋给src,如果没有data-src,则将src1的值赋给src

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/114253.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • JAVA 解析Xml字符串

    JAVA 解析Xml字符串JAVA解析Xml字符串(dom4j)

    2022年5月4日
    55
  • vue JS 对象转数组[通俗易懂]

    vue JS 对象转数组[通俗易懂]option:{ head:{ title:”日期”, name:date, width:180 }, data:{ date:”2021-05-27″, name:”张三”, address:”上海市浦东新区XX路XX号” } }转数组:letoption=this.option;letArr=Object.keys(option).map(k

    2025年11月6日
    2
  • C++和Java怎么选择,哪个好找工作?

    C++和Java怎么选择,哪个好找工作?Java和C++各有各的优势,至于选择什么方向要看你的兴趣爱好,只要你基础扎实我相信找工作都不难,而且语言都是相通的。从两者语言入门来说:Java入门相对简单,C++入门相对难,精通更难! 从学习侧重来说:Java侧重于企业级应用开发,C++则注重底层应用开发。 从就业来说:C++前期工资要高,工作机会少。Java招聘多,工作机会多。 从前景来说:Java、C++长期在编程排行榜前几位,所以学习哪个都可以。 从未来来说:无论你学习Java还是学习C++,只要有多年的经验,工资都会高,不过在工作期

    2022年7月7日
    20
  • @Page指令中的AutoEventWireup

    @Page指令中的AutoEventWireup以前根本不注意AutoEventWireup这个小小的属性,但是后来由于它产生的许多麻烦使我不得不研究它,并最终领悟了它。如果你写了一个asp.net页面,里面包含了服务端脚本:voidPage_Load(objectsender,EventArgse){lblMessage.Text=”ThinkinginTechmango.com”;}

    2022年5月28日
    38
  • 网页播放rtsp视频流

    网页播放rtsp视频流网页播放rtsp视频流原文:https://blog.csdn.net/u011562107/article/details/78548605?locationNum=10&amp;fps=1RTSP协议(1)是流媒体协议。(2)RTSP协议是共有协议,并有专门机构做维护。(3)RTSP协议一般传输的是ts、mp4格式的流。(4)RTSP传输一般需要2-3个通…

    2022年10月18日
    3
  • python hashlib_python中hashlib模块用法示例

    python hashlib_python中hashlib模块用法示例我们以前介绍过一篇 Python 加密的文章 Python 加密的实例详解 今天我们看看 python 中 hashlib 模块用法示例 具体如下 hashlibhashl 主要提供字符加密功能 将 md5 和 sha 模块整合到了一起 支持 md5 sha1 sha224 sha256 sha384 sha512 等算法具体应用 usr bin envpython coding UTF 8

    2025年10月29日
    3

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号