家電商品一覧を表示する

 書籍やDVDと同様に家電商品も表示させることができます(サムネール画像のサンプルを実行する。サムネール画像と商品名を表示するサンプルを実行する)。家電商品の場合はクエリーのSearchIndexを「SearchIndex=Electronics」にして送信します。表示指定はDVDと全く同じで以下のようになっています。

salesrank売れている順
pricerank安い順
-pricerank高い順
titlerankアルファベット順
-titlerankアルファベット逆順
-orig-rel-date新しい順
orig-rel-date古い順

 アマゾンの商品ページには購入者からのレビューが掲載されていることがあります。このレビューの情報はクエリーとして送るResponseGroupを「ResponseGroup=Large」とします。これで得られたXMLデータの中からレビュー部分を抜き出します。レビューはCustomerReviewsタグ内のReviewタグ内にあるContentタグ内にあります。レビューが複数ある場合にはReviewタグが繰り返されることになります。ここでは一番最初のレビューのみ表示することにします。幸いにしてReviewタグ内にあるContentタグは他で使用されていないのでgetElementsByTagName("Content")としてタグ情報を取得します。後は、テキストノードを読み出して表示します。(サンプルを実行する

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>アマゾン検索 (家電、レビュー付きタイトル一覧)</title>
<link rel="stylesheet" href="main.css" type="text/css" media="all">
<script type="text/javascript" src="xmlhttp.js"></script>
<script type="text/javascript"><!--
function amazonSearch()
{
n = $("bCode").value;
httpObj = createXMLHttpRequest(displayData);
if (httpObj)
{
httpObj.open("GET","amazon.rb?query="+n+"&cache="+(new Date()).getTime(),true);
httpObj.send(null);
}
}
function displayData()
{
if ((httpObj.readyState == 4) && (httpObj.status == 200))
{
$("result").innerHTML = bookList(httpObj.responseXML);
}
}
function bookList(xml)
{
txt = "";
itemList = xml.getElementsByTagName("Item");
for (i=0; i<itemList.length; i++)
{
eleTitle = itemList[i].getElementsByTagName("Title")[0].childNodes[0].nodeValue;
eleURL = itemList[i].getElementsByTagName("DetailPageURL")[0].childNodes[0].nodeValue;
eleObj = itemList[i].getElementsByTagName("SmallImage")[0];
eleImage = eleObj.getElementsByTagName("URL")[0].childNodes[0].nodeValue;
eleMsg = itemList[i].getElementsByTagName("Content")[0].childNodes[0].nodeValue;
txt += '<a href="' + eleURL +'"><img src="'+eleImage+'" align="left">'+eleTitle+'</a><br>('+eleMsg+')<br clear="left"><hr>';
}
return txt;
}
// --></script>
</head>
<body>
<h1>アマゾン検索 (家電、レビュー付きタイトル一覧)</h1>
<form method="get" name="ajaxForm" onsubmit="amazonSearch();return false;">
ジャンルコード:<input type="text" value="3371421" id="bCode">
<input type="button" value="タイトル一覧表示" onClick="amazonSearch()">
</form>
<div id="result"></div>
</body>
</html>

 場合によってはタグが存在せずにエラーになる可能性もあります。そのような場合には以下のようにtry...catchでエラー回避してしまう方法もあります。(サンプルを実行する

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>アマゾン検索 (家電一覧、表示方法指定)</title>
<link rel="stylesheet" href="main.css" type="text/css" media="all">
<script type="text/javascript" src="xmlhttp.js"></script>
<script type="text/javascript"><!--
function amazonSearch()
{
n = $("bCode").value;
if (n == 0) return;
ft = $("findType").value;
if (ft == 0) return;
httpObj = createXMLHttpRequest(displayData);
if (httpObj)
{
httpObj.open("GET","amazon.rb?query="+n+"&findtype="+ft+"&cache="+(new Date()).getTime(),true);
httpObj.send(null);
}
}
function displayData()
{
if ((httpObj.readyState == 4) && (httpObj.status == 200))
{
$("result").innerHTML = bookList(httpObj.responseXML);
}
}
function bookList(xml)
{
txt = "";
itemList = xml.getElementsByTagName("Item");
for (i=0; i<itemList.length; i++)
{
eleMsg = eleTitle = eleURL = eleObj = eleImage = "";
try { eleTitle = itemList[i].getElementsByTagName("Title")[0].childNodes[0].nodeValue; }catch(e){}
try { eleURL = itemList[i].getElementsByTagName("DetailPageURL")[0].childNodes[0].nodeValue; }catch(e){}
try { eleObj = itemList[i].getElementsByTagName("SmallImage")[0]; }catch(e){}
try { eleImage = eleObj.getElementsByTagName("URL")[0].childNodes[0].nodeValue; }catch(e){}
try { eleMsg = itemList[i].getElementsByTagName("Content")[0].childNodes[0].nodeValue; }catch(e){}
txt += '<a href="' + eleURL +'"><img src="'+eleImage+'" align="left">'+eleTitle+'</a><br>('+eleMsg+')<br clear="left"><hr>';
}
return txt;
}
// --></script>
</head>
<body>
<h1>アマゾン検索 (家電一覧、表示方法指定)</h1>
<form method="get" name="ajaxForm" onsubmit="amazonSearch();return false;">
<select id="bCode">
<option value="0">カテゴリを選択してください</option>
<option value="3371371">デジタルカメラ</option>
<option value="10658411">カメラ</option>
<option value="3371441">DVDプレーヤー・レコーダー</option>
<option value="3371411">ポータブルオーディオ</option>
<option value="3371341">コンピュータ</option>
<option value="3371351">PC周辺機器・パーツ</option>
<option value="3371361">プリンタ・スキャナ</option>
<option value="3371381">ネットワーク機器</option>
<option value="3371401">PDA・電子辞書</option>
<option value="3371421">アクセサリ・サプライ</option>
<option value="3371391">ストレージメディア</option>
<option value="3371431">オーディオビジュアル</option>
</select>
<select id="findType">
<option value="0">表示方法を選択してください</option>
<option value="salesrank">売れ筋順</option>
<option value="pricerank">価格の安い順</option>
<option value="-pricerank">価格の高い順</option>
<option value="titlerank">アルファベット順</option>
<option value="-titlerank">アルファベット逆順</option>
<option value="-release-date">新しいものから表示</option>
<option value="release-date">古いものから表示</option>
</select>
<input type="button" value="タイトル一覧表示" onClick="amazonSearch()">
</form>
<div id="result"></div>
</body>
</html>

 次項では、その他の商品について補足説明します。

[第八章 7:その他の商品表示についてへ]
[目次へ]

(2006.1.24)