
こんにちは、お世話になります。
早速ですが、質問がございます。
下記のようなコードを使用して、商品のデーターを呼び出し
tableで表示させているのですが、
商品のデーターを15個表示させる指定をした場合に、
横に15個全てが並んでしまいます。
これを、5個毎に段を増やして、
2段目、3段目と表示させることは可能でしょうか?
何か良い方法がございましたら
ご教授をお願いいたします。
それでは、何卒よろしくお願いいたします。
<table>
<tr>
<? for ($i = 0; $i < intval($xml->CurrentCount); $i++) { ?>
<? $item = $xml->Goods[$i] ?>
<? $size = calcImageSize($item->width, $item->height) ?>
<td><a href="<?=$item->LinkCode?>"><img src="<?=$item->ImageUrl?>" width="100" height="140" alt="<?=mb_convert_encoding($item->GoodsName, "SJIS","UTF-8")?>" /></a><br /><span class="red"><?='¥'.number_format($item->Price)?></span></td>
<? } ?>
</tr>
</table>
A 回答 (2件)
- 最新から表示
- 回答順に表示
No.2
- 回答日時:
gooの仕様(か、OKWaveの仕様で【回答上でリンクになっている文字列に続けて不可視な文字が含まれる】から取り除いてね。
ソースコードは、ある程度力があれば自力で理解できるはずなので解説はしない。そこまでの勉強は自分でやるべきだと思っている。
==================Q5420571-1.php(書いたPHPのコード)=================
<?php
/*
.NETでいう、
System.Func<Array<T>,int,bool,T,Array<T>>
にして、中にDOMに関するコードをかかないことで、DOMへの依存性を下げた。
*/
function distribute($src,$n,$fillflag,$absent){
$dest = array();
while(count($src) > 0){
$temp = array();
for($i = 0;$i < $n; $i++){
array_push($temp,$src[0]);
array_splice($src,0,1);
if(count($src) == 0){
while(($fillflag == true) && (count($temp) < $n)){
array_push($temp,$absent);
}
break;
}
}
array_push($dest,$temp);
}
return $dest;
}
function init(){
$xhtmlns = "http://www.w3.org/1999/xhtml";
/* 勝手にSimpleXMLと予想。ちゃんとこういうのは書きましょう */
$xml = simplexml_load_file("Q5420571-1.xml");
$num = 5;
$items = distribute($xml->xpath("Goods"),$num,true,null);
/* 個人的にSimpleXMLは好きじゃないのでDOMでいく。*/
$impl = new DOMImplementation();
/*
貧民的プログラミングの発想をしないように!
http://takagi-hiromitsu.jp/diary/20051227.html#p02
*/
/* DOCTYPE宣言と一致するとlibxmlはmeta要素を頼みもしないのに勝手に挿入しやがります。*/
$doctype = $impl->createDocumentType(
"html",
"-//W3C//DTD XHTML 1.0 Strict//EN",
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
);
$doc = $impl->createDocument($xhtmlns,"html",$doctype);
$head = $doc->createElementNS($xhtmlns, "head");
$title = $doc->createElementNS($xhtmlns, "title");
$title->appendChild($doc->createTextNode("テスト"));
$link = $doc->createElementNS($xhtmlns, "link");
$link->setAttribute("rel" ,"stylesheet");
$link->setAttribute("type" , "text/css");
$link->setAttribute("href","Q5420571-1.css");
$head->appendChild($title);
$body = $doc->createElementNS($xhtmlns, "body");
$table = $doc->createElementNS($xhtmlns, "table");
$tbody = $doc->createElementNS($xhtmlns, "tbody");
for ($i = 0;$i < count($items);$i++){
$tr = $doc->createElementNS($xhtmlns, "tr");
/* thが必要な場合は自分でコードを考えてね */
for ($j = 0;$j < $num;$j++){
$td = $doc->createElementNS($xhtmlns, "td");
if (!is_null($items[$i][$j])){
$a = $doc->createElementNS($xhtmlns, "a");
$a->setAttribute("href",(string)($items[$i][$j]->LinkCode));
$td->appendChild($a);
$img = $doc->createElementNS($xhtmlns, "img");
$img->setAttribute("src",(string)($items[$i][$j]->ImageUrl));
$img->setAttribute("alt",(string)($items[$i][$j]->GoodsName));
$img->setAttribute("width","100");
$img->setAttribute("height","140");
$td->appendChild($img);
/* 俺が嫌いなのでbr要素は使わない */
/*
classにredとか入っているの嫌いなので
代わりにpriceを付けた。CSSもこれにあわせてあるので注意
*/
$span = $doc->createElementNS($xhtmlns, "span");
$span->setAttribute("class","price");
$span->appendChild($doc->createTextNode(number_format(doubleval((string)($items[$i][$j]->Price)))));
$td->appendChild($span);
}
$tr->appendChild($td);
}
$tbody->appendChild($tr);
}
$table->appendChild($tbody);
$body->appendChild($table);
$doc->documentElement->appendChild($head);
$doc->documentElement->appendChild($body);
$doc->encoding = "Shift_JIS";
$doc->formatOutput = true;
/* 必要に応じてここは変える */
header("Content-Type:application/xhtml+xml");
print($doc->saveXML());
}
init();
?>
============Q5420571-1.xml同じディレクトリにあるXMLファイル===============
<?xml version="1.0" encoding="UTF-8"?>
<a>
<Goods>
<width>16</width>
<height>16</height>
<GoodsName>Goolge Favicon</GoodsName>
<LinkCode>http://www.google.co.jp/</LinkCode>
<ImageUrl>http://www.google.co.jp/favicon.ico</ImageUrl>
<Price>1500</Price>
</Goods>
<Goods>
<width>242</width>
<height>95</height>
<GoodsName>OKWave バナー</GoodsName>
<LinkCode>http://okwave.jp/</LinkCode>
<ImageUrl>http://service.okwave.jp/okwave_com/images/logo_ …
<Price>740</Price>
</Goods>
<Goods>
<width>16</width>
<height>16</height>
<GoodsName>Goolge Favicon</GoodsName>
<LinkCode>http://www.google.co.jp/</LinkCode>
<ImageUrl>http://www.google.co.jp/favicon.ico</ImageUrl>
<Price>300</Price>
</Goods>
<Goods>
<width>242</width>
<height>95</height>
<GoodsName>OKWave バナー</GoodsName>
<LinkCode>http://okwave.jp/</LinkCode>
<ImageUrl>http://service.okwave.jp/okwave_com/images/logo_ …
<Price>4300</Price>
</Goods>
<Goods>
<width>16</width>
<height>16</height>
<GoodsName>Goolge Favicon</GoodsName>
<LinkCode>http://www.google.co.jp/</LinkCode>
<ImageUrl>http://www.google.co.jp/favicon.ico</ImageUrl>
<Price>650</Price>
</Goods>
<Goods>
<width>242</width>
<height>95</height>
<GoodsName>OKWave バナー</GoodsName>
<LinkCode>http://okwave.jp/</LinkCode>
<ImageUrl>http://service.okwave.jp/okwave_com/images/logo_ …
<Price>700</Price>
</Goods>
<Goods>
<width>16</width>
<height>16</height>
<GoodsName>Goolge Favicon</GoodsName>
<LinkCode>http://www.google.co.jp/</LinkCode>
<ImageUrl>http://www.google.co.jp/favicon.ico</ImageUrl>
<Price>1500</Price>
</Goods>
<Goods>
<width>242</width>
<height>95</height>
<GoodsName>OKWave バナー</GoodsName>
<LinkCode>http://okwave.jp/</LinkCode>
<ImageUrl>http://service.okwave.jp/okwave_com/images/logo_ …
<Price>740</Price>
</Goods>
<Goods>
<width>16</width>
<height>16</height>
<GoodsName>Goolge Favicon</GoodsName>
<LinkCode>http://www.google.co.jp/</LinkCode>
<ImageUrl>http://www.google.co.jp/favicon.ico</ImageUrl>
<Price>300</Price>
</Goods>
<Goods>
<width>242</width>
<height>95</height>
<GoodsName>OKWave バナー</GoodsName>
<LinkCode>http://okwave.jp/</LinkCode>
<ImageUrl>http://service.okwave.jp/okwave_com/images/logo_ …
<Price>4300</Price>
</Goods>
<Goods>
<width>16</width>
<height>16</height>
<GoodsName>Goolge Favicon</GoodsName>
<LinkCode>http://www.google.co.jp/</LinkCode>
<ImageUrl>http://www.google.co.jp/favicon.ico</ImageUrl>
<Price>650</Price>
</Goods>
<Goods>
<width>242</width>
<height>95</height>
<GoodsName>OKWave バナー</GoodsName>
<LinkCode>http://okwave.jp/</LinkCode>
<ImageUrl>http://service.okwave.jp/okwave_com/images/logo_ …
<Price>700</Price>
</Goods>
</a>
===================Q5420571-1.css(同じディレクトリにあるCSSファイル)=================
@charset "UTF-8";
@namespace "http://www.w3.org/1999/xhtml";
span.price{
color:red;
}
==================出力結果(ソース)=====================================
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dt …
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<title>テスト</title>
<link rel="stylesheet" type="text/css" href="Q5420571-1.css" />
</head>
<body>
<table>
<tbody>
<tr>
<td>
<a href="http://www.google.co.jp/"></a>
<img src="http://www.google.co.jp/favicon.ico" alt="Goolge Favicon" width="100" height="140" />
<span class="price">1,500</span>
</td>
<td>
<a href="http://okwave.jp/"></a>
<img src="http://service.okwave.jp/okwave_com/images/logo_ … alt="OKWave バナー" width="100" height="140" />
<span class="price">740</span>
</td>
<td>
<a href="http://www.google.co.jp/"></a>
<img src="http://www.google.co.jp/favicon.ico" alt="Goolge Favicon" width="100" height="140" />
<span class="price">300</span>
</td>
<td>
<a href="http://okwave.jp/"></a>
<img src="http://service.okwave.jp/okwave_com/images/logo_ … alt="OKWave バナー" width="100" height="140" />
<span class="price">4,300</span>
</td>
<td>
<a href="http://www.google.co.jp/"></a>
<img src="http://www.google.co.jp/favicon.ico" alt="Goolge Favicon" width="100" height="140" />
<span class="price">650</span>
</td>
</tr>
<tr>
<td>
<a href="http://okwave.jp/"></a>
<img src="http://service.okwave.jp/okwave_com/images/logo_ … alt="OKWave バナー" width="100" height="140" />
<span class="price">700</span>
</td>
<td>
<a href="http://www.google.co.jp/"></a>
<img src="http://www.google.co.jp/favicon.ico" alt="Goolge Favicon" width="100" height="140" />
<span class="price">1,500</span>
</td>
<td>
<a href="http://okwave.jp/"></a>
<img src="http://service.okwave.jp/okwave_com/images/logo_ … alt="OKWave バナー" width="100" height="140" />
<span class="price">740</span>
</td>
<td>
<a href="http://www.google.co.jp/"></a>
<img src="http://www.google.co.jp/favicon.ico" alt="Goolge Favicon" width="100" height="140" />
<span class="price">300</span>
</td>
<td>
<a href="http://okwave.jp/"></a>
<img src="http://service.okwave.jp/okwave_com/images/logo_ … alt="OKWave バナー" width="100" height="140" />
<span class="price">4,300</span>
</td>
</tr>
<tr>
<td>
<a href="http://www.google.co.jp/"></a>
<img src="http://www.google.co.jp/favicon.ico" alt="Goolge Favicon" width="100" height="140" />
<span class="price">650</span>
</td>
<td>
<a href="http://okwave.jp/"></a>
<img src="http://service.okwave.jp/okwave_com/images/logo_ … alt="OKWave バナー" width="100" height="140" />
<span class="price">700</span>
</td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</body>
</html>
この回答への補足
こんにちは。
この度は、大変ご丁寧にありがとうございました!
上記のコードを参考に、
色々試行錯誤してみたのですが、上手くいきませんでした。
ちなみに、現在使用しているプログラムの全体は
下記のようになっております。
==================index.php=================
<?
/*
* created by interspace
* AccessTrade Webサービスサンプル PHP版
*
* version 1.0 2006/09/12
* version 1.01 2006/10/23
* version 1.10 2009/03/12:SimpleXML関数対応
* pager部分をクリックした際に、カテゴリが引き継げなくなるのを修正
*/
require_once 'config.inc.php';
define('WS_TYPE', 'searchgoods');
define('BASE_QUERY', '?ws_ver='.WS_VER.'&ws_id='.WS_ID.'&ws_type='.WS_TYPE);
if (isset($_REQUEST['search'])) {
$resource = ATWS_URL.BASE_QUERY;
$resource .= '&row='.$_REQUEST['row'];
$resource .= '&page='.$_REQUEST['page'];
$resource .= '&category1='.$_REQUEST['category'];
$resource .= '&shop='.$_REQUEST['shop'];
$resource .= '&sort1='.$_REQUEST['sort1'];
$resource .= '&sort2='.$_REQUEST['sort2'];
$resource .= '&sort3='.$_REQUEST['sort3'];
$resource .= '&search='.urlencode(mb_convert_encoding($_REQUEST['keyword'], XML_ENCODE, ENCODE));
$xml = simplexml_load_file( $resource );
$data = $_REQUEST;
}
else {
$data['row'] = '10';
$data['category'] = '';
}
?>
<? if (isset($_REQUEST['search'])) { ?>
<? if ($xml->ErrorMsg != '') { ?>
<?=$xml->ErrorCode?><?=$xml->ErrorMsg?>
<? } elseif (intval($xml->CurrentCount) == 0) { ?>
<? } else { ?>
<table>
<tr>
<? for ($i = 0; $i < intval($xml->CurrentCount); $i++) { ?>
<? $item = $xml->Goods[$i] ?>
<? $size = calcImageSize($item->width, $item->height) ?>
<td><a href="http://a.at.ser.tagreco.com/?to=<?=$item->LinkCo … rel="nofollow"><img src="<?=$item->ImageUrl?>" width="100" height="140" alt="<?=mb_convert_encoding($item->GoodsName, "SJIS","UTF-8")?>" /></a><br /><span class="red"><?='¥'.number_format($item->Price)?></span></td>
<? } ?>
</tr>
</table>
<? } ?>
<? } ?>
<?
//-- functions --
//画像の表示サイズを計算する
function calcImageSize($width, $height)
{
return $array;
}
?>
-------------ここまで------------
このファイルに、下記のようなパラメーターを追加して
商品のデーターを呼び出しています。
index.php?ws_ver=1&ws_id=91C8DA5665488CFDBF7132938F8956D5198793&ws_type=searchgoods&search=1&row=5&category=600,700,1300&sort1=5&sort2=12&sort3=11&shop=31054&
(例)
http://www.apacolle.jp/web/index.php?ws_ver=1&ws …
下記の表のループというのも見つけましたが、
これを実際にどう追加して良いのか分かりませんでした。
http://www.phppro.jp/qa/1532
大変恐れ入りますが、再度ご教授いただけますと幸いです。
それでは、何卒よろしくお願いいたします。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS FC2カートのテンプレートでの商品表示について 1 2023/03/02 18:05
- HTML・CSS テーブルタグのセルの幅の一部だけを指定 1 2023/03/12 12:02
- HTML・CSS cssが効かなくて困ってます 1 2023/01/01 23:57
- HTML・CSS 自身のHPにYouTube動画を貼り付けるのが出来なくなり困ってます 1 2022/11/11 10:44
- Visual Basic(VBA) Selenium.ChromeDriverの使い方について 7 2022/09/22 06:43
- Perl RSSにdiv,ul classを付けたいのですがどのようにつけるのかわからないです 2 2022/03/28 01:53
- PHP htmlで複数の個数入力欄を表示させるには 1 2022/09/20 03:11
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
- JavaScript EasyUIのSubGrid(jquery)におけるObjectに入れた連想配列について 1 2022/05/02 11:21
- PHP style.cssのjQuery条件付きcssが機能しない 4 2022/07/17 18:27
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・昔のあなたへのアドバイス
- ・字面がカッコいい英単語
- ・許せない心理テスト
- ・歩いた自慢大会
- ・「I love you」 をかっこよく翻訳してみてください
- ・ゆるやかでぃべーと タイムマシンを破壊すべきか。
- ・はじめての旅行はどこに行きましたか?
- ・準・究極の選択
- ・この人頭いいなと思ったエピソード
- ・「それ、メッセージ花火でわざわざ伝えること?」
- ・ゆるやかでぃべーと すべての高校生はアルバイトをするべきだ。
- ・【お題】甲子園での思い出の残し方
- ・【お題】動物のキャッチフレーズ
- ・人生で一番思い出に残ってる靴
- ・これ何て呼びますか Part2
- ・スタッフと宿泊客が全員斜め上を行くホテルのレビュー
- ・あなたが好きな本屋さんを教えてください
- ・かっこよく答えてください!!
- ・一回も披露したことのない豆知識
- ・ショボ短歌会
- ・いちばん失敗した人決定戦
- ・性格悪い人が優勝
- ・最速怪談選手権
- ・限定しりとり
- ・性格いい人が優勝
- ・これ何て呼びますか
- ・チョコミントアイス
- ・単二電池
- ・初めて自分の家と他人の家が違う、と意識した時
- ・「これはヤバかったな」という遅刻エピソード
- ・ゴリラ向け動画サイト「ウホウホ動画」にありがちなこと
- ・泣きながら食べたご飯の思い出
- ・一番好きなみそ汁の具材は?
- ・人生で一番お金がなかったとき
- ・カラオケの鉄板ソング
- ・自分用のお土産
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
Firefoxを使ってるのですがズー...
-
html でのテキスト結合について
-
cssで、テーブルのtdの中の文字...
-
IEでテーブル内のテキストが...
-
td要素内のdiv要素をセンタリン...
-
同じクラス名はつけないほうが...
-
<img>タグにCSSのclass設定可能?
-
テーブルの枠線に色が付かない
-
HTMLでテーブルタグ<table>を使...
-
firefoxで「height: 100%;」と...
-
テーブルの一部分のセルだけに...
-
tableタグとformタグの組み合わせ
-
vbscriptで時計を作りたい
-
ブラウザによってテーブルのセ...
-
FireFoxで背景が表示されない。
-
Tableタグで作成した表の縮小
-
リストの記号を括弧付きの文字...
-
テーブルタグの中にdivを含めて...
-
TABLEのセルの中の文字を行単位...
-
テーブルの任意の列を非表示に...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
tableタグとformタグの組み合わせ
-
html でのテキスト結合について
-
テーブルの一部分のセルだけに...
-
同じクラス名はつけないほうが...
-
表とリスト(ulとtable)の違い...
-
cssで、テーブルのtdの中の文字...
-
<img>タグにCSSのclass設定可能?
-
Tableタグで作成した表の縮小
-
Tableタグ内のspan styleが適応...
-
trとtrの間
-
firefoxで「height: 100%;」と...
-
vbscriptで時計を作りたい
-
divで囲んだ文字が消える
-
固定ヘッダーがある時のページ...
-
td要素内のdiv要素をセンタリン...
-
formのinputなどの幅100%指定
-
Dreamweaver デザインビューの...
-
連続した空白を入れたい時は<pr...
-
XHTMLに関する質問 順序が逆に...
-
vertcial-align:top が効かない
おすすめ情報