Question

我正在尝试编写一段代码，用于在页面加载时用另一个图像替换图像。但遗憾的是，事情并非如此。第二张图片无法加载。我只在页面加载后看到带有十字标记的图标。请看下面的代码，让我知道什么是错的。提前谢谢。

<html>    
<head>
<script type="text/javascript">    
function loadImage()    
{
   document.getElementById('ab').src ="C:\Users\Gagan\Desktop\green.png";    
}
</script>    
</head>    
<body>    
<img Id= "ab" src="C:\Users\Gagan\Desktop\red.jpg" onload="loadImage()">    
</body>    
</html>

Answer 1

在JavaScript中，反斜杠是转义字符。如果要将其包含在字符串中，则必须使用它自己将其转义：

document.getElementById('ab').src = "C:\\Users\\Gagan\\Desktop\\green.png";

Answer 2

对于此问题的未来观看者，我建议使用unobtrusive JavaScript pattern，其中onload完全在JavaScript中完成：

<html>    
<head>
<script type="text/javascript">
var img = document.getElementById('ab');    
function loadImage()    
{
   img.src ="C:\\Users\\Gagan\\Desktop\\green.png";    
}
img.onload = loadImage;
</script>
</head>    
<body>    
<img id="ab" src="C:\Users\Gagan\Desktop\red.jpg" alt="" />    
</body>    
</html>

无法使用javascript更改img元素的src

2 个答案: