Using JavaScript to write location of an image within a table?

markscotland · 02-22-2011, 03:18 PM

Is it possible to use JavaScript to locate all of the "smiley sad Icon.jpg"'s and output the location within the table?

Such as A3, and B2.

Thank you in advance.

Code:

<html>
<body>
<table width="200" border="1">
  <tr Id="A">
    <td Id="1"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png"> </td>
    <td Id="2"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png"></td>
    <td Id="3"><img src="http://www.iconeasy.com/icon/thumbnails/System/Icons%20for%20Developers/smiley%20sad%20Icon.jpg"></td>
  </tr>
  <tr Id="B">
    <td Id="1"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png"></td>
    <td Id="2"><img src="http://www.iconeasy.com/icon/thumbnails/System/Icons%20for%20Developers/smiley%20sad%20Icon.jpg"></td>
    <td Id="3"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png"></td>
  </tr>
  <tr Id="C">
    <td Id="1"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png"></td>
    <td Id="2"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png"></td>
    <td Id="3"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png"></td>
  </tr>
</table>

</body>
</html>

Krupski · 02-22-2011, 05:08 PM

Quote:

Originally Posted by markscotland

Is it possible to use JavaScript to locate all of the "smiley sad Icon.jpg"'s and output the location within the table?

Such as A3, and B2.

Thank you in advance.

Making a WGET script, huh?

This should get you started:

Code:

<script type="text/javascript">
var findImg = function(name) {
    var e = document.getElementsByTagName('img');
    var i = e.length; // how many img elements total
    var str = ''; 
    while (i--) {
        if (e[i].src.indexOf(name) != -1) // if match...
        str += e[i].src + '\n'; //...copy to str with a newline
    }
    alert(str); // display all matches
}

findImg('smiley%20sad%20Icon.jpg'); // call the function with the name to be matched

</script>

All this does is find anything which matches the input to the function and pops it up in an alert window. But all the stuff is there so get you started.

You may want to stick something like .toLowerCase() on the search string and the filename strings so that they match the name even if the case doesn't match.

Have fun.....

-- Roger

markscotland · 02-22-2011, 05:26 PM

Quote:

Code:

<script type="text/javascript">
var findImg = function(name) {
    var e = document.getElementsByTagName('img');
    var i = e.length; // how many img elements total
    var str = ''; 
    while (i--) {
        if (e[i].src.indexOf(name) != -1) // if match...
        str += e[i].src + '\n'; //...copy to str with a newline
    }
    alert(str); // display all matches
}

findImg('smiley%20sad%20Icon.jpg'); // call the function with the name to be matched

</script>

After Trying to get my head around this, it doesn't seem to add the new lines to the output or anything for that matter. I thought there would be a JavaScript command to export the location of each cell the image was contained within. Novice at coding

on W3schools atm looking up too much of everything else but what I need

~EDIT

Got it displaying the names of each image

Now to work out how to display the cell its in.