用javascript替换图像

我想用javascript替换gif文件。我找到下面的方法。有没有什么办法可以将javascript标签放在img标签之前？用javascript替换图像

<img class="myImg" src="compman.gif" width="107" height="98"> 

<script> 
    document.getElementsByClassName("myImg")[0].src = "hackanm.gif"; 
</script>

来源

2016-06-27 sum man

为什么你想要？你*可以*把代码放在任何你想要的地方。您只需确保查找HTML元素的代码行不会执行，直到该元素存在。你想在这里解决的实际问题是什么？这是不是工作？ – David

用'$（document）.ready（function（）{}）;'（请参阅：https：//learn.jquery.com/using-jquery-core/document-ready/）包围当前的javascript，然后就可以将其放置在页面的任何位置。 –

在文档“准备就绪”之前，不能安全地操作页面。使用jquery的$(document).ready()，它将等待，直到页面被加载并准备好在被执行之前被执行（不管它在页面上的什么位置）。例如：

<script> 
    $(document).ready(function() { 
     document.getElementsByClassName("myImg")[0].src = "hackanm.gif"; 
    }); 
</script> 
<img class="myImg" src="compman.gif" width="107" height="98">

你也可以再里面jQuery的杠杆选择（如$(".class")其中类是类，或$("#id")其中id是ID）和修改代码：

<script> 
    $(document).ready(function() { 
     $(".myImg").attr('src',"hackanm.gif"); 
    }); 
</script> 
<img class="myImg" src="compman.gif" width="107" height="98">

，并进一步您甚至可以将它存储在一个变量，如果你想稍后在JavaScript中改变它！

<script> 
    $(document).ready(function() { 
     var myImg = $(".myImg"); 
     var newImg = "hackanm.gif"; 
     myImg.attr('src', newImg); 
    }); 
</script> 
<img class="myImg" src="compman.gif" width="107" height="98">

希望这可以帮助你学习JavaScript里面的一些新技巧！快乐的编码！

More Info

来源

2016-06-27 19:14:29

相信OP主要关心的是旧图像的闪光是由JavaScript替换之前。我建议你添加一行CSS来使你的图像元素可见地隐藏，然后通过JavaScript进行swap + unhide。

<style> 
    .myImg {visibility: hidden;} 
</style> 

<img class="myImg" src="compman.gif" width="107" height="98"> 

<script> 
    var imgReplace = document.getElementsByClassName("myImg")[0]; 
    imgReplace.src = "hackanm.gif"; 
    imgReplace.style.visibility = "visible"; 
</script>

来源

2018-01-19 15:47:14

用javascript替换图像

回答

相关问题