js如何将绝对url传入到img标签的src中
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js如何将绝对url传入到img标签的src中相关的知识，希望对你有一定的参考价值。
可以使用jQuery将图片的绝对地址，传入<img>图片标签中，设置它的src的值为图片地址。
jsp测试代码如下：
<body>
<img id=“ img_id" />
</body>
js测试代码如下：
$("#img_id").attr("src",");
以上测试代码，通过JQuery修改id为img_id的图片标签，引用图片src为图片绝对路径。 参考技术A document .getElementById ("a").src="路径"
js 设置img标签的src资源无法找到的替代图片(通过img的属性设置)
在网站的前端页面设计中，要考虑到img图片资源的存在性，如果img的src图片资源不存在或显示不出来，则需要显示默认的图片。如何做到呢？
一、监听document的error事件
document.addEventListener("error", function (e) { var elem = e.target; if (elem.tagName.toLowerCase() === ‘img‘) { var notFoundImgSrt = $(elem).attr("notFoundSrc"); if (notFoundImgSrt) { $.get(notFoundImgSrt, null, function (response, status, xhr) { if (xhr.status === 200) elem.src = notFoundImgSrt; }); } } }, true);
img的onerror事件是不冒泡的，因此我们得自己手动写代码，监听document的error事件。如果当前发出error事件的目标是img标签，则找到该img标签的notFoundSrc属性，并通过ajax去判断当前站点是否存在该默认图片，如果存在该默认图片，则将其赋值该img的src属性。
二、设置img标签的notFoundSrc属性
<img src="xxxxx" alt="" notFoundSrc="images/imgNotFound.png"/>
由代码可以看见，xxxxx不是一个真实图片资源的路径，因此：
1、img标签必会触发其error事件；
2、由于我们自定义了一个document的error监听事件，这时document就会捕捉img发出的error事件；
3、执行error事件的逻辑。
以上是关于js如何将绝对url传入到img标签的src中的主要内容，如果未能解决你的问题，请参考以下文章