특정이미지 src 경로 변경
본문
모든 페이지에 삽입되어있는 특정 이미지
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
id/class 지정없이 파일명으로만 쉽게 할수있는 방법 있을까요
답변 3
$(document).ready(function() {
var imgElements = document.getElementsByTagName('img');
for (var i = 0; i < imgElements.length; i++) {
var imgSrc = imgElements[i].src;
var fileName = imgSrc.substring(imgSrc.lastIndexOf('/') + 1);
if (fileName === 'abc.gif') {
imgElements[i].src = 'http://naver.com/abc.gif';
}
}
});
이런식으로 만들어서 모든 페이지 하단에 include 되는 페이지에 삽입 하시면 됩니다.
php
<?php
$str = <<<HEREDOC
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
HEREDOC;
$tmp = str_replace('<img src="./abc.gif">', '<img src="http://naver.com/abc.gif">', $str);
echo $tmp;
/*
<img src="http://naver.com/abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="http://naver.com/abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="http://naver.com/abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="http://naver.com/abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="http://naver.com/abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
*/
?>
JavaScript
<xmp id="tmp">
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="./abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
</xmp>
<script>
var tmp = document.getElementById('tmp');
if (tmp != null) {
tmp.innerHTML = tmp.innerHTML.replace(/<img src="\.\/abc\.gif">/g, '<img src="http://naver.com/abc.gif">');
/*
<img src="http://naver.com/abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="http://naver.com/abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="http://naver.com/abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="http://naver.com/abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
<img src="http://naver.com/abc.gif">는
<img src="http://naver.com/abc.gif">로 노출해라
*/
}
</script>
이렇게 해보는건 어떠실까요?
// 이미지 소스 변경 함수
function changeImageSource(imageFilename) {
var images = document.getElementsByTagName('img');
for (var i = 0; i < images.length; i++) {
var img = images[i];
if (img.src.includes('abc.gif')) {
img.src = imageFilename;
}
}
}
// 이미지 소스 변경 호출
changeImageSource('http://naver.com/abc.gif');
답변을 작성하시기 전에 로그인 해주세요.