-
January 13th, 2012, 08:30 PM
#1
How to load image from another page
hello,
I am using JavaScript to do the following:
I have 2 pages that I am using..
Page 1 has all the images on it (images.htm)
Page 2 is the page I want to display the images. (main.htm)
So what I am tring to do is, on Page 1 it has a image on there using the img tag it also has a ID tag.
I want to use Page 2 get that image source from page 1 by the img tag using the ID tag.
however there is more than 1 image on Page 1. but once I work out how to do one I will know how to do the rest.
I know this sounds silly to load the page this way, but Page 1 no one will see and I want to be able to get the image source from that page.
anyone have any ideas on how to do this? Hope you understand what I am tring to do.
So far I know how to get the image source if it's on the same page but don't know how to get the image source from another local page..
Code:
var a=document.getElementsByTagName('a');
for(var i=0; i<a.length; i++)
{
var img=a[i].getElementsByTagName('img');
for(var j=0; j<img.length; j++)
{
alert(img[j].src);
}
}
Thanks.
Last edited by aaronking; January 13th, 2012 at 08:47 PM.
-
January 13th, 2012, 11:19 PM
#2
Re: How to load image from another page
First off, that is very inefficient, incorrect code. You're looking through all the anchors just to search within for <img> tags. Why even bother? One simple loop through all the <img> tags will be sufficient.
Second, your bigger issue is going to be reading from another page. Unless you're loading the content through AJAX, you're going to get denied access do to cross page scripting.
If the post was helpful...Rate it! Remember to use [code] or [php] tags.
-
January 13th, 2012, 11:39 PM
#3
Re: How to load image from another page
hello,
thanks for the feedback..
but how would you do it with ajax?
-
January 14th, 2012, 12:33 AM
#4
Re: How to load image from another page
One of the simplest JavaScript uses...http://w3schools.com/ajax/default.asp
If the post was helpful...Rate it! Remember to use [code] or [php] tags.
-
January 14th, 2012, 12:39 AM
#5
Re: How to load image from another page
Hello,
Thanks for pointing me to the correct way..
I ended up creating something simple
Code:
<script type="text/javascript">
var testing = $.get("test.htm", function(data){
alert(data);
});
</script>
however, how can I only get some parts of the HTML it returns?
I only want to be able to read the IMG tags only not the whole lot.
Any ideas?
Thanks.
-
January 14th, 2012, 02:03 AM
#6
Re: How to load image from another page
Hello,
Still have problems doing it..
so far I can get the HTML Source of the page I want to get the data from, but can't parse the tags from the code.
Any ideas?
Code:
<script type="text/javascript">
var testing = $.get("test.htm", function(data){
var arr = new Array();
arr = document.getElementsByTagName("IMG");
var feed = arr[1].getAttribute("src");
alert(feed);
});
</script>
Last edited by aaronking; January 14th, 2012 at 02:25 AM.
-
January 14th, 2012, 11:19 AM
#7
Re: How to load image from another page
Since I don't know what your get() function is, I really cannot help you...and even greater a question, why are you even bothering with that?
Code:
var xmlhttp;
if (window.XMLHttpRequest) {xmlhttp = new XMLHttpRequest();}
else {xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
var imgs = xmlhttp.responseText.getElementsByTagName("img");
// now work with your images
}
}
xmlhttp.open("GET", "page.html", true);
xmlhttp.send();
If the post was helpful...Rate it! Remember to use [code] or [php] tags.
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|