使用纯JavaScript而不是jquery更改锚标记中的图像源

Question

How can I change the image source which is embeded in anchor tag. 如何更改嵌入锚标记中的图像源。

Here is the code. 这是代码。

 <body class="home">
   <a href="#" class="logo"><img src="https://storage.googleapis.com/gweb-          
       uniblog-publish-prod/static/blog/images/google-200x200.7714256da16f.png"/></a
  </body>

Answer 1

<a href="newimage.jpg" onclick="this.children[0].src = this.href; return false;" class="logo"><img src="oldimage.jpg"/></a>

Answer 2

Add id to img tag , then use following code. 将id添加到img标签，然后使用以下代码。

<script>
document.getElementById("newImage").src="newImagepath/newimage.jpg";
</script>

Answer 3

您可以给此img标签指定一个ID，然后使用

 document.getElementById(id).src = "newimagesource.png" ;

Answer 4

尝试像这样使用querySelector

document.querySelector(".logo img").src = "your new src";

Answer 5

<body class="home">
   <a href="#" class="logo"><img id ="picture" src="https://storage.googleapis.com/gweb-          
       uniblog-publish-prod/static/blog/images/google-200x200.7714256da16f.png"/></a
  </body>

Javascript: 使用Javascript：

 <script type="text/javascript">
        document.getElementsById("picture").setAttribute("src", "New_image_path");
</script>

Answer 6

最小的方法是

document.querySelector(".logo img").src = "new_source";

Answer 7

Just assign the id attribute to the image and change the source, 
for your case:

 <body class="home" onload="changethesrc('newimagescr.png')"> <a href="#" class="logo"> <img src="https://storage.googleapis.com/gweb- uniblog-publish-prod/static/blog/images/google-200x200.7714256da16f.png" id="imageid"/></a </body> <script type="text/javascript"> function changethesrc(newsrc){ var tmpimg = document.getElementById("imageid"); tmpimg.src = newsrc; } </script>

Answer 8

Try this 尝试这个

document.getElementsByClassName("logo")[0].children[0].src="http://images.google.com/images/branding/googleg/1x/googleg_standard_color_128dp.png"

without using any id i have created a fiddle https://jsfiddle.net/f3rdnzgt/1/ 不使用任何ID我已经创建了一个小提琴https://jsfiddle.net/f3rdnzgt/1/

使用纯JavaScript而不是jquery更改锚标记中的图像源

问题描述

8 个解决方案

解决方案1
0 2016-12-30 05:17:40

解决方案2
0 2016-12-30 05:17:51

解决方案3
0 2016-12-30 05:18:15

解决方案4
0 2016-12-30 05:18:24

解决方案5
0 2016-12-30 05:19:15

解决方案6
0 2016-12-30 05:24:37

解决方案7
0 2016-12-30 05:25:16

解决方案8
0 2016-12-30 05:26:56

使用纯JavaScript而不是jquery更改锚标记中的图像源

问题描述

8 个解决方案

解决方案1 0 2016-12-30 05:17:40

解决方案2 0 2016-12-30 05:17:51

解决方案3 0 2016-12-30 05:18:15

解决方案4 0 2016-12-30 05:18:24

解决方案5 0 2016-12-30 05:19:15

解决方案6 0 2016-12-30 05:24:37

解决方案7 0 2016-12-30 05:25:16

解决方案8 0 2016-12-30 05:26:56

解决方案1
0 2016-12-30 05:17:40

解决方案2
0 2016-12-30 05:17:51

解决方案3
0 2016-12-30 05:18:15

解决方案4
0 2016-12-30 05:18:24

解决方案5
0 2016-12-30 05:19:15

解决方案6
0 2016-12-30 05:24:37

解决方案7
0 2016-12-30 05:25:16

解决方案8
0 2016-12-30 05:26:56