質問用掲示版 - 社会情報学メジャー　メジャー体験演習(PHP演習)

Home トピック表示アルバム留意事項検索過去ログ管理

コメント
おなまえ
Ｅメール
タイトル
参照URL
添付File
暗証キー	(英数字8文字以内)
画像認証	（右画像の数字入力）
文字色	■ ■ ■ ■ ■ ■ ■ ■ ■

2個のurlを横並びで

昨日質問したんですが、似たようなものをまねしてくださいと言われ、自分なりにやってみたのですが、うまくいきません。横並びにふたつのページを並べたいです。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>チャンピオンズリーグ</title>
<style>
div {
float:
background:
width:
padding:
text-align:
border:
margin:
color:
}
.image-contents img {
min-width:
height:
}
body {
background:
background-image: url("./20170910-00075581-roupeiro-000-5-view.jpg");
}
table{
width: 100%;
}
.td_style{
border-right: dashed;
border-left: dashed;
width: 30%;
}
</style>

</head>
<body>
<h1>チャンピオンズリーグ<h1>
<?php
require_once("phpQuery-onefile.php");
require_once("pathChanger.php");

$url_1 = "https://www.soccer-king.jp/stats/world/cl/match";
$doc_1 = phpQuery::newDocumentFileHTML($url_1);
$url_2 = "https://soccer.yahoo.co.jp/ws/uefa/standings/41";
$doc_2 = phpQuery::newDocumentFileHTML($url_2);
echo '<table><tr>';
echo '<td class="td_style">';
echo '取得サイト:'.$doc_1['title']->text();
echo fullpath($doc_1[".contents-main"],$url_1);
echo '</td>';
echo '<td class="td_style">';
echo '取得サイト:'.$doc_2['title']->text();
echo fullpath($doc_2["#contentMain"],$url_2);
echo '</td>';
echo '</tr></table>';
?>
</body>
</html>

あいうえお

2019/12/03(Tue) 13:59 No.701 [返信]

Re: 2個のurlを横並びで

テーブル内でfullpathを使わなければ表示できました．
下から６行目と９行目を変更しています．
あとは，テーブル内のレイアウトをwidth:50%(２つなので)に変更しています．

------------
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>チャンピオンズリーグ</title>
<style>
div {
float:
background:
width:
padding:
text-align:
border:
margin:
color:
}
.image-contents img {
min-width:
height:
}
body {
background:
background-image: url("./20170910-00075581-roupeiro-000-5-view.jpg");
}
table{
width: 100%;
}
.td_style{
border-right: dashed;
border-left: dashed;
width: 50%;
}
</style>

</head>
<body>
<h1>チャンピオンズリーグ<h1>
<?php
require_once("phpQuery-onefile.php");
require_once("pathChanger.php");

$url_1 = "https://www.soccer-king.jp/stats/world/cl/match";
$doc_1 = phpQuery::newDocumentFileHTML($url_1);
$url_2 = "https://soccer.yahoo.co.jp/ws/uefa/standings/41";
$doc_2 = phpQuery::newDocumentFileHTML($url_2);

echo '<table><tr>';
echo '<td class="td_style">';
echo '取得サイト:'.$doc_1['title']->text().'<br>';
echo $doc_1[".contents-main"];
echo '<td class="td_style">';
echo '取得サイト:'.$doc_2['title']->text();
echo $doc_2["#contentMain"];
echo '</td>';
echo '</tr></table>';
?>
</body>
</html>

TA 志垣

2019/12/03(Tue) 14:40 No.703

Re: 2個のurlを横並びで

いけました！！ありがとうございます！

あいうえお

2019/12/03(Tue) 15:01 No.704

無題

文字色とURLの色を白色にしたいのですが、うまくいかないです。
どこを変えたらいいでしょうか

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> 編み物レシピ　まとめ</title>
<style>
div{
.image-contents img {
min-width: 300px;
height: auto;
color: #EEEEEE;
}
link{ color:#FFFFFF;}//この辺に書いてます
color: #FFFFFF
}

body {
background-image: url("./12773118.jfif");

}
div {
.article {
display:block
border: 1px solid #CCCCCC;
margin: 15px 5px 10px 4px;
width:70px;
height:90px;
font-size:20px;
}
}
div {
.MdMTMWidgetList01{
display:block;
position:relative;
padding-bottom: 1px;
font-size:20px;
}
}
div {
.col-s6{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
padding-bottom: 1px;
font-size:20px;
}
}

table{
width: 100%;
}

.td_style{
border-right: dashed;
border-left: dashed;
width: 30%;
}
</style>
</head>
<body>
<h1>編み物レシピ　まとめ</h1>
<?php
require_once("phpQuery-onefile.php");
require_once("pathChanger.php");

$url_1 = "https://www.amuuse.jp/recipe/genre/knitting/";
$doc_1 = phpQuery::newDocumentFileHTML($url_1);
$url_2 = "https://matome.naver.jp/odai/2131818555139491301";
$doc_2 = phpQuery::newDocumentFileHTML($url_2);
$url_3 = "https://www.amuuse.jp/recipe/tool/knitting-crochet/?p=2&category%5B0%5D=%E6%A3%92%E9%87%9D%EF%BC%86%E3%81%8B%E3%81%8E%E9%87%9D ";
$doc_3 = phpQuery::newDocumentFileHTML($url_3);

echo '<table><tr>';
echo '<td class="td_style">';
echo '取得サイト:'.$doc_1['title']->text();
echo fullpath($doc_1[".col-m4"],$url_1);
echo '</td>';
echo '<td class="td_style">';
echo '取得サイト:'.$doc_2['title']->text();
echo fullpath($doc_2[".mdMTMWidget01Content01"],$url_2);
echo '</td>';
echo '<td class="td_style">';
echo '取得サイト:'.$doc_3['title']->text();
echo fullpath($doc_3[".col-s6.col-m4.match-height"],$url_3);
echo '</td>';
echo '</tr></table>';
?>
</body>
</html>

2019/12/03(Tue) 11:53 No.692 [返信]

Re: 無題

文字色を白色にする場合は，bodyタグの中にcolorで色を設定してあげてください！
<style>
body{
background-image: url("./12773118.jfif");
color:#ffffff;
}
</style>

URLの色の設定も以下のサイトを確認してください．
<style>
a:link { color: #0000ff; }
a:visited { color: #000080; }
a:hover { color: #ff0000; }
a:active { color: #ff8000; }
</style>
https://www.tagindex.com/stylesheet/link/color.html

TA長田

2019/12/03(Tue) 12:31 No.700

Re: 無題

できました！
ありがとうございます！

2019/12/03(Tue) 14:29 No.702

背景の画像が表示されない

背景の画像が表示されないです。回答お願いします。

<!DOCTYPE html>
<html>
<head>
<meta charest="UTF-8">
<title>ポケモン情報収集</title>
<style>
div {
float: left;
background: #ffffff;
width: 600px;
padding: 20px;
text-align: left;
border: 0px solid #cccccc;
margin: 15px 5px 10px 4px;
color: #000000;
}
body {
background: #f0f8ff;
background-image: url("./thN89ZGIZT.jpg");
}

</style>
</head>
<body>
<h1>ポケモン情報収集</h1>
<?php
require_once("phpQuery-onefile.php");
require_once("pathChanger.php");
echo '<div>';
$url = "https://gamewith.jp/pokemon-sword-shield/";
$doc = phpQuery::newDocumentFileHTML($url);
echo '取得サイト:'.$doc['title']->text().'<br>';
echo $doc['.article_outline'];
echo '</div>';
?>

<?php
require_once("phpQuery-onefile.php");
require_once("pathChanger.php");
echo '<div>';
$url = "https://game8.jp/pokemon-sword-shield/";
$doc = phpQuery::newDocumentFileHTML($url);
echo '取得サイト:'.$doc['title']->text().'<br>';
echo $doc['.menuItem-listItem'];
echo '</div>';
?>

</body>
</html>

2019/12/03(Tue) 10:02 No.683 [返信]

Re: 背景の画像が表示されない

お手本と同じようにはしてます。

2019/12/03(Tue) 10:21 No.685

Re: 背景の画像が表示されない

背景の画像名(./thN89ZGIZT.jpg)は正しいですか？

こちらで，別の画像で代用したところ，背景はきちんと表示されました．

TA 志垣

2019/12/03(Tue) 10:21 No.686

Re: 背景の画像が表示されない

別の画像でも表示されないです。
画像ファイルはexsi2019に入っているんですが

2019/12/03(Tue) 10:49 No.689

Re: 背景の画像が表示されない

学生番号というかアカウントは，s246255ですか？

フォルダ内に画像ファイルはないですよ．

[yoshino@com sys]$ ls -la ./s246255/public_html/exsi2019
total 208
drwxr-xr-x 3 s246255 Students 4096 Dec 3 10:40 .
drwx---r-x 3 s246255 Students 4096 Dec 3 09:49 ..
-rwxr-xr-x 1 s246255 Students 7680 Nov 26 17:30 Thumbs.db
-rwxr-xr-x 1 s246255 Students 156 Nov 19 17:17 hello.html
-rwxr-xr-x 1 s246255 Students 4198 Nov 19 17:25 pathChanger.php
-rwxr-xr-x 1 s246255 Students 167314 Nov 19 17:25 phpQuery-onefile.php
-rwxr-xr-x 1 s246255 Students 1389 Dec 3 10:47 report.php
-rwxr-xr-x 1 s246255 Students 1583 Dec 3 09:54 type-a1.gif
drwxr-xr-x 2 s246255 Students 4096 Dec 3 10:40 ????
[yoshino@com sys]$ ls -la ./s246255/public_html/exsi2019

吉野

2019/12/03(Tue) 10:56 No.690

Re: 背景の画像が表示されない

s246255であっています
exsi2019に入れなおしました。ですが表示されないです。授業でつかった背景。type-a1.gifも表示されないです。

何度もすみません

2019/12/03(Tue) 11:52 No.691

Re: 背景の画像が表示されない

でているとおもうけど．．．

吉野

2019/12/03(Tue) 11:57 No.694

Re: 背景の画像が表示されない

僕の方ではできないです…

yabo

2019/12/03(Tue) 12:15 No.696

Re: 背景の画像が表示されない

http://com.wakayama-u.ac.jp/~s246255/exsi2019/report.php

で表示できるでしょう？

吉野

2019/12/03(Tue) 12:19 No.698

Re: 背景の画像が表示されない

できました

ありがとうございます

何度も失礼しました

2019/12/03(Tue) 12:29 No.699

枠が何重にも表示されます

サイトの情報を取得したのですが、画像と文章が離れており、枠が何重にも表示されて非常に見にくいです。画像の近くに文章を表示させて、枠も一つにするにはどうすれば良いでしょうか？

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ロックフェス新着情報</title>
<style>
body {
background-image:url("./headphone.jpg");
}
div {
float: left;
background: #ffffff;
width: 300px;
padding: 20px;
text-align: left;
border: 0px solid #cccccc;
margin: 15px 5px 10px 4px;
color: #ff9900;
}
</style>
</head>
<body>
<h1 style="background-image:url(orange.gif);padding-left:10px;padding-top:4px;">
<font color="#ffffff">ロックフェス新着情報
</font>
</h1>
<?php
require_once("phpQuery-onefile.php");
require_once("pathChanger.php");
echo '<div>';
echo "<h2>レディクレ</h2>";
$url = "https://radiocrazy.fm/";
$doc = phpQuery::newDocumentFileHTML($url);
echo '取得サイト:'.$doc['title']->text().'<br>';
$news = $doc['.news-list'];
echo fullpath($news["li"],$url);
echo '</div>';
?>
</body>
</html>

2019/12/02(Mon) 14:40 No.664 [返信]

Re: 枠が何重にも表示されます

こちらの環境では画像などがないため再現できていませんが，おそらく枠が何重にも表示されていたのは，cssを<div>要素に適用していたので，取得したhtml内の全てに適用されていたためだと思います．

対策として一番外側のdiv要素にcontainerクラスを追加してそこに適応しています．
要素にcssを適用すると大量のタグに適用されてしまうため，クラス単位でcssを設定することをおすすめします．

///////////////////////////////////

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ロックフェス新着情報</title>
<style>
body {
background-image:url("./headphone.jpg");
}
.container{
float: left;
background: #ffffff;
width: 300px;
padding: 20px;
text-align: left;
border: 0px solid #cccccc;
margin: 15px 5px 10px 4px;
color: #ff9900;
}
</style>
</head>
<body>
<h1 style="background-image:url(orange.gif);padding-left:10px;padding-top:4px;">
<font color="#ffffff">ロックフェス新着情報
</font>
</h1>
<?php
require_once("phpQuery-onefile.php");
require_once("pathChanger.php");
echo '<div class="container">'; //ここにcontainerクラスを追加(cssもdiv要素でなくcontainerクラスに適用)
echo "<h2>レディクレ</h2>";
$url = "https://radiocrazy.fm/";
$doc = phpQuery::newDocumentFileHTML($url);
echo '取得サイト:'.$doc['title']->text().'<br>';

$news = $doc['.news-list > li']; //news-listクラス配下のリスト(<li>)部分を取得
echo $news;
//echo fullpath($news["li"],$url); //上記で対応(想像通りの出力になっていなければ言ってください)

echo '</div>';
?>
</body>
</html>

梅本(TA)

2019/12/02(Mon) 16:13 No.669

Re: 枠が何重にも表示されます

枠の問題は解消されたのですが、
$news = $doc['.news-list > li'];
にすると、サイトへ飛べなくなり、元サイトのimg altの部分が画像と重なって表示されます。そこで、echo fullpath($news["li"],$url);に直したら、サイトへも飛べるしaltも消えたのですが、画像とテキストの間隔がかなりあいてしまいました。どうすればよいでしょうか？

2019/12/03(Tue) 10:36 No.688

Re: 枠が何重にも表示されます

まず，
$news = $doc['.news-list'];
echo fullpath($news["li"],$url);

も

$news = $doc['.news-list > li'];
echo fullpath($news, $url);

も，書き方が違うだけでやってることは同じです．フルパス指定すれば同じ出力がされます．

しかし，フルパス指定では要素をそのまま全てもってきてしまうため，元サイトのCSSが適用されていることが前提の画像設定になります．(レスポンシブデザインのため)
よって['.news-list']のようにおおあじな取り方をすると元サイトと同じ複雑なCSS設定が必要となります．
もう少し細かい要素を取ってきて自分できれいに配置するか，元サイトのCSSを頑張って再現してください．

梅本(TA)

2019/12/03(Tue) 12:19 No.697

どこが悪いのか分かりません。

以前に出ていた、回答を参考にして自分で改造したところ何も表示しなくなりました。回答よろしくお願いします。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> Web情報収集システム　s246235 </title>
<style>
div{
float: left;
background: #ffffff;
width: 900px;
padding: 20px;
text-align: left;
border: 1px solid #cccccc;
margin: 15px 5px 10px 4px;
color: #ff6600;
}
body{
background: #f0f8ff;
background-image: url("./main.png");
}
div {
.l-detail l-detail--summary{
display:block;
position:relative;
padding-bottom: 1px;
font-size:20px;
}
}

.td_style{
border-right: dashed;
border-left: dashed;
width: 30%;
}
</style>
</head>
<body>
<h1> 天月ニュース </h1>
<?php
require_once("phpQuery-onefile.php");
require_once("pathChanger.php");
echo'<div>';
$url_1 = "https://amatsuki.jp/contents/news";
$doc_1 = phpQuery::newDocumentFileHTML($url);
$url_2 = "https://rockinon.com/artist/7830";
$doc_2 = phpQuery::newDocumentFileHTML($url);

//trは，行列の「列」にあたります．列ごとに１つずつサイトの中身を入れています．
echo '<table><tr>';
echo '<td class="td_style">';
echo '天月ニュース:'.$doc_1['title']->text();
echo fullpath($doc_1[".list-unstyled"],$url_1);
echo '</td>';
echo '<td class="td_style">';
echo 'プロフィール:'.$doc_2['title']->text();
echo fullpath($doc_1[".c-summary-profile__block"],$url_1);
echo '</td>';
echo '<td class="td_style">';
echo '関連記事:'.$doc_2['title']->text();
echo fullpath($doc_2[".l-detail-left"],$url_2);
echo '</td>';
echo '</tr></table>';
?>
?>
</body>
</html>

s246235

2019/12/01(Sun) 17:32

No.655 [返信]

Re: どこが悪いのか

回答が遅くなってしまい，すみません．．．

下から4行目のところで，「?>」を２つ付けていることが原因だと思います．
こちらで試した結果，きちんと表示されましたが，上手くいかなかった場合にはまた聞いてください．

インデント(改行)を変えて見やすくした方がミスに気づきやすいと思います．下記に訂正したコードを貼っておくので，参考にしてください．

-----------

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> Web情報収集システム　s246235 </title>
<style>
div{
float: left;
background: #ffffff;
width: 900px;
padding: 20px;
text-align: left;
border: 1px solid #cccccc;
margin: 15px 5px 10px 4px;
color: #ff6600;
}
body{
background: #f0f8ff;
background-image: url("./main.png");
}
div {
.l-detail l-detail--summary{
display:block;
position:relative;
padding-bottom: 1px;
font-size:20px;
}
}

.td_style{
border-right: dashed;
border-left: dashed;
width: 30%;
}
</style>
</head>
<body>
<h1> 天月ニュース </h1>
<?php
require_once("phpQuery-onefile.php");
require_once("pathChanger.php");
echo'<div>';
$url_1 = "https://amatsuki.jp/contents/news";
$doc_1 = phpQuery::newDocumentFileHTML($url);
$url_2 = "https://rockinon.com/artist/7830";
$doc_2 = phpQuery::newDocumentFileHTML($url);

//trは，行列の「列」にあたります．列ごとに１つずつサイトの中身を入れています．
echo '<table><tr>';
echo '<td class="td_style">';
echo '天月ニュース:'.$doc_1['title']->text();
echo fullpath($doc_1[".list-unstyled"],$url_1);
echo '</td>';
echo '<td class="td_style">';
echo 'プロフィール:'.$doc_2['title']->text();
echo fullpath($doc_1[".c-summary-profile__block"],$url_1);
echo '</td>';
echo '<td class="td_style">';
echo '関連記事:'.$doc_2['title']->text();
echo fullpath($doc_2[".l-detail-left"],$url_2);
echo '</td>';
echo '</tr></table>';
?>
</body>
</html>

TA 志垣

2019/12/02(Mon) 11:07 No.657

Re: どこが悪いのか

改行しても，このシステムでは反映されないんですね．．．
失礼しました．

TA 志垣

2019/12/02(Mon) 11:08 No.658

Re: どこが悪い

お手数おかけして申し訳ないです。

s246235

2019/12/02(Mon) 12:34 No.661

Re: どこが悪いのか分

どの辺に問題がありそうか教えてください。
これは改善するのが難しいのでしょうか？

s246235

2019/12/02(Mon) 23:06 No.680

Re: どこが悪いのか

ざっとしか見てないのですが変数名を間違えてませんか？

$url_1 = "https://amatsuki.jp/contents/news";
$doc_1 = phpQuery::newDocumentFileHTML($url);
$url_2 = "https://rockinon.com/artist/7830";
$doc_2 = phpQuery::newDocumentFileHTML($url);

この部分は「phpQuery::newDocumentFileHTML($url)」ではなく「phpQuery::newDocumentFileHTML($url_1);」と「phpQuery::newDocumentFileHTML($url_2);」
ではないでしょうか？
その部分はもう変更されましたか？

TA長田

2019/12/03(Tue) 00:33 No.681

Re: どこが悪いのか

変更した結果、一部修正されたのですが、url2の内容が表示されていません。題名は出ているのですが…

s246235

2019/12/03(Tue) 10:00 No.682

Re: どこが悪いのか

下から６行目のコードで指定しているクラスがよくないです．
下記のコードを入れるとスクレイピングできると思います．

echo fullpath($doc_2[".c-article-middle"],$url_2);

TA 志垣

2019/12/03(Tue) 12:03 No.695

:: 質問用掲示版 - 社会情報学メジャー メジャー体験演習(PHP演習) ::

:: 質問用掲示版 - 社会情報学メジャー　メジャー体験演習(PHP演習) ::