HTML/Javascript - Get image source from online file
I want to have an image in a webpage that can be changed based on the filepath stored in a file online (it doesn't matter what typer of text file - xml, .txt - whatever works best). So I basically want to have the page retrieve the text from that file, and then use that text as the source for an image in that page. I'm assuming this is a Javascript thing, but it doesn't matter to me, as long as it works. Any ideas? Thanks!!
**Edit: Forgot to mention: I'm using the code in a Google Chrome Extension, not sure that matters, as it uses regular HTML/Javascript, but it's stored on the users computer, and I want the image to be stored on my server.
**Edit2:
Just got something that seems to work very well, and I only need this in the body part of the code:
开发者_运维知识库 <script type="text/javascript" >
var i=0;
for (i=0;i<=FilePath.length - 1;i++)
{
document.write('<img src="' + FilePath[i] + '"/>');
}
</script>
Hope this is valid code, but it definitely seems to work here...
Its simple store the filepaths in a Javascript file , create an array in the JS file , and include all the filepaths in the array, then store the file on the webserver .
Then after that you can retrieve it using
<script src="JS_File_path_on_web_server" type="text/javascript" ></script>
After you retrieve it , you can use Javascript , I prefer jQuery , to replace the src attribute on the Image with the one from the array .
EDIT : Full version :
//Javascript web server File
var FilePath=new Array("Path1","Path2","Path3");
Create a file like this and store as many paths as you want in the array .
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js">
</script>
<script src="JS_File_path_on_web_server" type="text/javascript" ></script>
<script type="text/javascript" >
$(document).ready(function()
{
$('#DisplayImage').attr('src',FilePath[0]);
});
</script>
</head>
<body>
<img src="" id="DisplayImage" />
</body>
</html>
This is a simple example , you can try learning javascript and Jquery to tweak it further .
Since my php based answer was not applicable, we can all ignore it now. :)
加载中,请稍侯......
精彩评论