PDA

View Full Version : Reading HTML source via Javascript


zbattery
11-11-2002, 03:19 PM
We use Yahoo store. In the "view shopping cart" page they allow us to place JavaScript and additional HTML to the top of the page. We want to make some enhancements to that page, but we need the information contained in HTML created by Yahoo to do it. Specifically, we need to extract the quantities of each line item.

Where the HTML states "<input type=text size=4 value=" - I'm trying to get what the value is within that input tag. Since we don’t create that HTML, we have to get that information "post HTML creation".

Currently, we extract the _links_ from Yahoo’s HTML for other processing, and that works great.

Thank you, Karl Oehling - Zbattery.com



Here is an example of the page source:

<html><head><title>Zbattery.com Shopping Cart</title><script language=JavaScript><!--

onunload=putcookie;

function putcookie(){

var ProcellList = new Array(
"pc12a",
"pc175a",
"pc7k67",
"pc903",
"pc908",
"pc9100",
"pc915",
"pc918",
"pl123a",
"procell-9v",
"procell-9v-12pack",
"procell-aa",
"procell-aa-24pack",
"procell-aaa",
"procell-aaa-24pack",
"procell-c",
"procell-c-12pack",
"procell-d",
"procell-d-12pack"
);

cookie_name = "cartprocell";
theygotprocell="0";

for (i=0; i<document.links.length; i++) {
startlink=document.links[i].href.lastIndexOf("/");
endlink=document.links[i].href.lastIndexOf(".");
procellstr=document.links[i].href.substring(startlink+1,endlink);

for (j=0; j<ProcellList.length; j++) {
if(procellstr == ProcellList[j]) {
theygotprocell="1";
}
}
}

if(theygotprocell=="1"){
document.cookie=cookie_name+"=yesprocell;";
}
else{
cookie_name = "cartprocell";
document.cookie=cookie_name+"=noprocell;";
}
}

//--></script>

<link rel=stylesheet href=/lib/zbattery/zbattery.css type=text/css>

<table width="100%" border=0 cellspacing=0 cellpadding=0>
<tr bgcolor="#0000CE">
<td width="1%" bgcolor="#0000CE" height=2>
<div align=right></div>
</td>
</tr>
</table>
</head>




^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
everything above is our code we added to Yahoo's page.
I've cut out a lot of it to reduce message size.

everything below is the relavent content created by Yahoo, who's server we are on.
I've cut out a lot of it to reduce message size.
\/ \/ \/ \/ \/ \/ \/ \/ \/ \/ \/





<body background="http://order.store.yahoo.com/I/zbattery_1714_60050"><table border=0 cellspacing=0 cellpadding=0><tr valign=TOP><td><img src="http://order.store.yahoo.com/I/zbattery_1714_59966" width=2 height=20 border=0 hspace=0 vspace=0></td><td><img src="http://order.store.yahoo.com/Img/trans_1x1.gif" height=1 width=26 border=0 alt=pad></td><td><a href=http://store.yahoo.com/zbattery/index.html><img src="http://order.store.yahoo.com/I/zbattery_1714_60226" width=0 height=5 border=0 hspace=0 vspace=0></a><br><br><table border=0 cellspacing=0 cellpadding=0 width=742><tr valign=TOP><td>
<font size=2 face=arial color=000000><form name=vw-form method=post action="https://order.store.yahoo.com/cgi-bin/wg-order?unique=fc309&catalog=zbattery&et=3dcfca11&basket=5C80e188d800675d3dcfc2dd41054d1e188d88822a3d8e92b7c5e6a572536b8e1"><input type=hidden name=vwcatalog value=zbattery>
<input type=hidden name=vwnitems value=2>
<input type=hidden name=vwtotal value=349.79>
<input type=hidden name=basket value=5C80e188d800675d3dcfc2dd41054d1e188d88822a3d8e92b7c5e6a572536b8e1>
<input type=hidden name=et value=3dd149a9>
<input type=hidden name=vwentropy value=1037026057>
<table width="100%" border=0 bgcolor=ffffff cellpadding=10 cellspacing=0><tr><td><font size=2 face=arial color=000000></font></td></tr><tr><td><font size=2 face=arial color=000000><table cellpadding=0 cellspacing=0 border=0 width="100%" bgcolor=CECFCE>

<tr bgcolor=ffffff><td align=left width="43%"><font size=2 face=arial color=000000><table border=0 cellpadding=0><tr><td width=70><font size=2 face=arial color=000000><img src="/Img/trans_1x1.gif" width=40 height=40></font></td><td><font size=2 face=arial color=000000><a href=http://store.yahoo.com/zbattery/magrechsys1.html><font color=0000c0>Mag-Lite Rechargeable Flashlight System #1</font></a><br><br><font size=-2 face=verdana>[<a href="http://order.store.yahoo.com/cgi-bin/wg-order?unique=fc309&catalog=zbattery&et=3dcfca11&basket=5C80e188d800675d3dcfc2dd41054d1e188d88822a3d8e92b7c5e6a572536b8e1&delete-b2dcc4c87950306d7236f37814589e3d=remove"><font color=0000c0>Remove</font></a>]</font></font></td></tr></table></font></td><td width="17%" nowrap align=right><font size=2 face=arial color=000000>&nbsp;89.83&nbsp;</font></td><td width="17%" align=center><font size=2 face=arial color=000000><input type=text size=4 value=3 name=qb2dcc4c87950306d7236f37814589e3d></font></td><td width="21%" nowrap align=right><font size=2 face=arial color=000000>269.49&nbsp;</font></td></tr>
<tr bgcolor=ffffff><td align=left width="43%"><font size=2 face=arial color=000000><table border=0 cellpadding=0><tr><td width=70><font size=2 face=arial color=000000><a href=http://store.yahoo.com/zbattery/magreclam.html><font color=0000c0><img width=40 height=70 src="http://order.store.yahoo.com/I/zbattery_1714_503777" border=0 align=center></font></a></font></td><td><font size=2 face=arial color=000000><a href=http://store.yahoo.com/zbattery/magreclam.html><font color=0000c0>Mag-Lite Rechargable Lamp</font></a><br><br><font size=-2 face=verdana>[<a href="http://order.store.yahoo.com/cgi-bin/wg-order?unique=fc309&catalog=zbattery&et=3dcfca11&basket=5C80e188d800675d3dcfc2dd41054d1e188d88822a3d8e92b7c5e6a572536b8e1&delete-eeb3e5890db93b2555f06cdf099b2218=remove"><font color=0000c0>Remove</font></a>]</font></font></td></tr></table></font></td><td width="17%" nowrap align=right><font size=2 face=arial color=000000>&nbsp;3.65&nbsp;</font></td><td width="17%" align=center><font size=2 face=arial color=000000><input type=text size=4 value=22 name=qeeb3e5890db93b2555f06cdf099b2218></font></td><td width="21%" nowrap align=right><font size=2 face=arial color=000000>80.30&nbsp;</font></td></tr>

</td></tr></table></td></tr></table></body></html>

realisis
11-11-2002, 05:06 PM
Generally, you query the values for each input by specifying

document.formname.elementname.value

Going by the code you posted for instance, you already know the name of the form is "vw-form". As you look at each input tag, you'll see the name specified for that as well.

One caveat: if your JS additions appear towards the top of the page, and if the form and inputs appears lower on the page, you likely will not be able to access the input values at runtime, but you will be able to access them if you put the 'value' queries into a function and trigger it onload or after load.

Does this help?

zbattery
11-12-2002, 06:40 AM
Eureeka!

I knew that was kinda the direction I should have been going in... but everything that needed to be in place wasn't there. Kudos to you for your help.

Now... on to the next hurdle.

Karl Oehling
Zbattery.com

cupbrAnte
06-12-2009, 07:18 AM
The seek code was very good.
led flashlight (http://www.lightflashlights.com/)