CodingForums.com

CodingForums.com (http://www.codingforums.com/index.php)
-   JavaScript programming (http://www.codingforums.com/forumdisplay.php?f=2)
-   -   how to extract img src from an external list (http://www.codingforums.com/showthread.php?t=273820)

sallam 09-22-2012 09:41 AM

how to extract img src from an external list
 
Greetings

I need your help please..
I have a website of 20 pages. Each page displays an image from a catalog located in another domain, and the catalog changes each week, so I have to change the img src attribute each week too (the jpg images are named differently each week, though in the same directory). So instead of editing 20 html pages each time, I'm trying to find a way to control the img src from a text file, so that I edit only that text file once a week.

Is there a way to extract img src attributes from a text file or js file please?
For example I need page 1 to extract the first img src listed in the text file, and page 2 to extract the second src listed, etc.
I'm new to js so please give an example of the code that I should use.

Many thanks.

vwphillips 09-22-2012 12:32 PM

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
</head>

<body>
<img id="tst" />

<script type="text/javascript">
/*<![CDATA[*/

function ajax(url,id,nu){
 var request=false;
 if (window.ActiveXObject){
  try {
  request=new ActiveXObject("Msxml2.XMLHTTP");
  }
  catch (e){
  try {
    request=new ActiveXObject("Microsoft.XMLHTTP");
  }
  catch (e){
  }
  }
 }
 else if (window.XMLHttpRequest){
  request=new XMLHttpRequest();
 }
 else {
  return false;
 }
 request.onreadystatechange=function(){ ajaxpopulate(request,document.getElementById(id),nu); }
 request.open('GET',url+'?'+new Date().getTime(),true);
 try {
  request.send(null);
 }
 catch (e){
 }
}

function ajaxpopulate(request,obj,nu){
 if (request.readyState==4&&(request.status==200||window.location.href.indexOf("http")==-1)){
  var src=request.responseText.split('\n')[nu];
  if (obj&&src){
  obj.src=src;
  }
 }
}

ajax('ajaximg.txt','tst',1)
/*]]>*/
</script>
</body>

</html>

ajaximg.txt

Code:

http://www.vicsjavascripts.org.uk/StdImages/Egypt5.jpg
http://www.vicsjavascripts.org.uk/StdImages/Egypt6.jpg
http://www.vicsjavascripts.org.uk/StdImages/Egypt7.jpg


sallam 09-22-2012 12:46 PM

Thanks very much.
I've tried your code (created test.html and ajaximg.txt in my pc desktop), but the test page didn't display any images. Do the files need to be uploaded to a server for them to work?

vwphillips 09-22-2012 03:27 PM

both files need to be in the same directory

or the file path of ajaximg.txt needs to be specified in the call

in any event both files must be in the same domain

sallam 09-23-2012 06:53 AM

Yes, both files are on my desktop. But the test.html page loads nothing. I'm confused.. what is wrong?..
I tried the images and each loads fine on their own browser tabs. But still the page loads no images...


All times are GMT +1. The time now is 05:20 AM.

Powered by vBulletin®
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.