img src 绝对路径拼接
时间: 2023-09-23 21:09:23 浏览: 50
如果要拼接绝对路径,可以直接在 `src` 属性中指定完整的 URL。例如:
```html
<img src="http://www.example.com/images/image.jpg">
```
这样就可以加载指定的图片了。需要注意的是,如果该图片的 URL 是动态生成的,则需要使用服务器端脚本将其生成为完整的 URL。
相关问题
html中 动态拼接src路径
可以使用JavaScript动态拼接src路径,例如:
```html
<img id="myImage" src="" alt="My Image">
<script>
var imagePath = "images/my-image.jpg";
var image = document.getElementById("myImage");
image.src = imagePath;
</script>
```
在上面的示例中,首先定义了一个空的img元素,并指定了id和alt属性。然后使用JavaScript获取该元素,并将src属性设置为动态拼接的图片路径。最后,图片将显示在页面上。
uniapp 图片路径拼接
在uniapp中,图片路径的拼接可以使用相对路径和绝对路径两种方式。
1. 相对路径:
相对路径是相对于当前页面或组件的路径,可以通过以下方式进行拼接:
```
<template>
<img :src="imgUrl" />
</template>
<script>
export default {
data() {
return {
imgUrl: '../../static/img/logo.png'
}
}
}
</script>
```
上述代码中,`imgUrl` 是相对于当前页面的路径。如果当前页面的路径为 `pages/index/index.vue`,那么 `../../static/img/logo.png` 就是相对于该路径的路径。
2. 绝对路径:
绝对路径是相对于项目根目录的路径,可以通过以下方式进行拼接:
```
<template>
<img :src="imgUrl" />
</template>
<script>
export default {
data() {
return {
imgUrl: '/static/img/logo.png'
}
}
}
</script>
```
上述代码中,`imgUrl` 是相对于项目根目录的路径,以 `/` 开头表示是绝对路径。无论当前页面的路径是什么,都可以通过绝对路径来访问图片。
需要注意的是,如果项目使用了uniCloud,图片的路径可能与普通uniapp项目有所不同,需要根据实际情况进行调整。