识别网站页面上的某个公共部分

Question

I have a list of common links for product pages, and I need to go through and grab all the links for the product image on each product page.

Eg I have got this far: I have a whole spreadsheet full of links like this

http://www.apc.com/products/moreimages.cfm?partnum=WSYSW100KF

the problem is I need the acutal image links for another column on my spreadsheet (it;s going to be used for a import on a eccomerce shop)

the thing is these image links don't seem to match up in any way and can be quite varied

http://www.apcmedia.com/resource/images/500/Front_Left/98EC66CA-5056-AE36-FE51936B432B1C17_pr.jpg

I have identified though that these images sit in what looks like a common area on the product page code

<div align="center"><img align="center" src="http://www.apcmedia.com/resource/images/500/Front_Left/98EC66CA-5056-AE36-FE51936B432B1C17_pr.jpg"></div>

How can I indetify that <img align="center" src=""> part in Jquery on each page ?

I'm thinking if I iterate through all those links, then I can grab the releavnt direct Image link, grab it and repopulate into another spreadsheet column.

I'm just not 100% on how to achieve this, any advice would be greatly appreciated.

Thanks

Answer 1

Use this selector to select the relevant images:

var result = [];
$("div[align=center] > img[align=center]").each(function(){
   var link = $(this).prop("src");
   //Do something, eg:
   result.push(link);
});
//result is a list which hold all links

.prop() returns the absolute URL of an image, even when the src attribute contains a relative URL.
A > B selects every element B which is an immediate child of A .

If your src attribute * follows a certain pattern, you can also use the following selector:

$("div[align=center] > img[src^='http://path/to/images'][src$='.jpg']");
//src^= means: Match if the `src` attribute starts with ...
//src$= means: Match if the `src` attribute ends with ...