HTML / Javascript - 从在线文件获取图像源

时间:2011-05-22 02:37:47

标签: javascript html

我希望在网页中有一个可以根据存储在文件中的文件路径进行更改的图像(文本文件的大小写无关紧要 - xml,.txt - 无论什么效果最好)。 所以我基本上想让页面从该文件中检索文本,然后使用该文本作为该页面中图像的源。 我假设这是一个Javascript的东西,但对我来说无关紧要,只要它有效。 有任何想法吗? 谢谢!

**编辑:忘记提及:我正在使用谷歌Chrome扩展程序中的代码,不确定是否重要,因为它使用常规HTML / Javascript,但它存储在用户计算机上,我希望图像能够存储在我的服务器上。

* * EDIT2:

刚刚得到的东西看起来效果很好,我只需要代码的正文部分:

      <script type="text/javascript" >
      var i=0;
      for (i=0;i<=FilePath.length - 1;i++)
      {
      document.write('<img src="' + FilePath[i] + '"/>');
      }
      </script>

希望这是有效的代码,但它似乎在这里工作......

2 个答案:

答案 0 :(得分:1)

它简单地将文件路径存储在Javascript文件中,在JS文件中创建一个数组,并在数组中包含所有文件路径,然后将文件存储在Web服务器上。

之后,您可以使用

检索它
<script src="JS_File_path_on_web_server" type="text/javascript" ></script>

检索之后,您可以使用Javascript,我更喜欢使用jQuery,将Image上的src属性替换为数组中的src属性。

编辑:完整版:

//Javascript web server File
var FilePath=new Array("Path1","Path2","Path3");

创建一个这样的文件,并在数组中存储任意数量的路径。

<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>

这是一个简单的例子,你可以尝试学习javascript和Jquery来进一步调整它。

答案 1 :(得分:1)

由于我的基于php的答案不适用,我们现在都可以忽略它。 :)