Question

我使用Google Weather API创建了一个插件，目前我正在从Google的API中提取图像。阳光灿烂的日子，我正在拉http://www.google.com//ig/images/weather/sunny.gif。

我正在寻找一种方法，以便在拉出sunny.gif时，用我选择的图像替换。

用jQuery或其他方式可以吗？

非常感谢

Answer 1

$("#my_image").attr("src","http://www.myimagepath.com/image.jpg");

Answer 2

取决于您如何接收/传递图像，只需将其设置为变量并检查它。这是解决这个简单问题的简单/懒惰的解决方案，如果您的问题更复杂，您可以将其转换为检查和替换阳光，暴风雨等的功能......

if (img === "http://www.google.com//ig/images/weather/sunny.gif") {
  img = "myownimage.gif";
}

PHP / JS反模式：

<?php if ($image === "http://www.google.com//ig/images/weather/sunny.gif"): ?>
  <script type="text/javascript">
    $("#image").attr('src', 'foo.gif');
  </script>
<?php endif; ?>

但老实说，如果你用PHP接收图像，那么我只是在服务器端操作并将其显示给客户端，而不是让JavaScript做它...

<?php
if ($image === "http://www.google.com//ig/images/weather/sunny.gif") {
  $image = 'foo.gif';
}
?>

<img src="<?php echo $image ?>" alt="my sunny day image" />

Answer 3

文档中的所有img元素都有一个实时document.images集合。您可以根据自己喜欢的逻辑有条件地更改任何特定图像的src属性：

var image, images = document.images;

for (var i=0, iLen=images.length; i<iLen; i++) {
  image = images[i];
  if (image.src == 'whatever') image.src = 'new value';
}

您可能还想访问图片的 parentNode 及其部分属性。

但在我看来，这在服务器上做得更好。

替换给定的<img/>来源

3 个答案: