Question

我无法找到更好的标题，随时可以编辑。

我想使用脚本作为图像src属性，如下所示：

<img src="img.js"/>

注意：我不在乎它是javascript还是php或其他任何语言。

这是我的文件夹内容：

的index.html
img.js
3.JPG

我想要显示＆＃34; 3.jpg＆＃34;图像来自＆＃34; img.js＆＃34;

我试过了：

var img = new Image();
img.src = "3.jpg";
document.append(img);

但它没有用。

我可以看到没有调用js脚本，因为当我添加一个console.log调用时，它不会在控制台中显示任何内容。

我该怎么做？有可能吗？

目标是：

有一个服务器端脚本，可以选择要显示的图像。
不要在HTML

Answer 1

<img src=...需要来自指定网址的图片数据。您无法将Javascript转储为源，因为它不是图像 - 它的代码。浏览器将把JS代码视为图像数据，尝试弄清楚它是什么样的图像（jpg，gif，png等等）然后去＃34; wtf是这个？＆＃ 34;并只显示一个损坏的图像图标。

无论你做什么网址，图片的来源都必须输出原始二进制图像数据，例如

HTML：

<img src="img.php" />

img.php：

<?php
header('Content-type: image/jpeg');
readfile('3.jpg');

Answer 2

<img src="<?php include "img.php" ?>"/>

在img.php中：

<?
echo "3.jpg";
?>

Answer 3

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>example</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
  $("#dummy").attr("src", '3.png').css("display", "block");
});
</script> 
</head>
<body>
<img id="dummy" style="display:none" src="" />
</body>
</html>

这是一个例子，但正如之前的帖子所暗示的那样，听起来好像拥有像php一样的服务器端脚本是什么？

无需编写图像即可显示图像

3 个答案: