data-src和src的区别

`data-src` 和 `src` 都是在 HTML 标签中使用的属性，但是它们在作用上有一些区别。

`src` 属性是指定元素的资源地址，比如 `img` 标签的图片地址、`script` 标签的脚本地址等。这些资源会在页面加载时立即请求并加载。

`data-src` 属性则是用于存储一些数据。它通常用于延迟加载或者懒加载，比如图片懒加载。在图片懒加载中，`data-src` 存储了图片的真实地址，而 `src` 属性则存储了一个占位符图片，当页面滚动到需要展示图片的位置时，再将 `data-src` 中的地址赋给 `src` 属性，从而加载真实的图片资源。

总的来说，`src` 是用于指定资源地址的，而 `data-src` 则是用于存储数据的，通常在一些特殊场合下才会使用。

相关问题

data-src 是什么意思

"data-src" 是一个 HTML 属性，通常用于指定一个图像或视频的来源 URL。该属性与 "src" 属性类似，不同之处在于 "data-src" 属性通常用于延迟加载图像或视频，以提高页面的加载性能。当页面滚动到需要显示图像或视频的位置时，JavaScript 代码会将 "data-src" 属性的值复制到 "src" 属性中，从而加载图像或视频。

怎么在模板中给相应的元素添加 data-src 属性

在模板中给元素添加 data-src 属性可以使用 v-bind 指令，语法如下:

<template>
  <div>
    <img v-bind:data-src="imageSrc">
  </div>
</template>

在脚本中定义 imageSrc 即可.

如果您是在HTML自己写的话，可以直接用 data-src="{{imageSrc}}"

<img data-src="{{imageSrc}}">

需要注意的是，data- 开头的属性为自定义属性，这种属性不会影响元素的默认行为,而只是用来存储额外的信息.