PHPでJavascriptを書き出しHTMLから読み込む
目次
ブログの新着記事のリストを表示したいけど、そのページではPHPが使えない。ってときに使えます。また外部のブログのRSSを読み込みたい時に使えます。
まず、PHPで最新の投稿記事をブログのRSSから読み込み、動的な内容に合わせてJavascriptを書き出す。そしてHTMLページからJavascriptで呼出し表示します。
<?php //読み込みたいXMLのパス $rssurl = "http://qwerty.work/blog/index.xml?" . date ( "YmdHis" , time() ); $rssdata = simplexml_load_file( $rssurl ); //表示件数 $num_of_data = 5; $outdata = "'<ul>'\n" ; for ( $i =0; $i < $num_of_data ; $i ++){ $pubDate = $rssdata ->channel->item[ $i ]->pubDate; $pubDate = date ( 'Y-m-d' , strtotime ( $pubDate )); $outdata .= "+'<li>'\n" ; $outdata .= "+'<small>" . $pubDate . "</small> " ; $outdata .= "<a href=\"" ; $outdata .= $rssdata ->channel->item[ $i ]->link; $outdata .= "\">" ; $outdata .= $rssdata ->channel->item[ $i ]->title; $outdata .= "</a>'\n" ; $outdata .= "+'</li>'\n" ; } $outdata .= "+'</ul>'" ; //↓これがないと書き出したスクリプトをJavascriptとして認識してもらえない header( "Content-type: application/x-javascript" ); echo "document.write($outdata)" ; ?> |
上記を呼び出すと以下の内容のJavascriptが書き出されます。(サンプル)
document.write( '<ul>' + '<li>' + '<small>2025-04-19</small> <a href="https://qwerty.work/blog/2025/04/cloudflare-workers-prerenderio-csr-seo.php">Cloudflare Workers + Prerender.io で CSRサイトを SEO 対応する方法</a>' + '</li>' + '<li>' + '<small>2025-04-15</small> <a href="https://qwerty.work/blog/2025/04/studio-bing-index-seo.php">STUDIOで制作したサイトがBingにインデックスされない問題</a>' + '</li>' + '<li>' + '<small>2025-03-20</small> <a href="https://qwerty.work/blog/2025/03/dns-dkim-spf-test.php">【DNS】メールを送るだけでSPFとDKIMのチェックができるテストサイト</a>' + '</li>' + '<li>' + '<small>2025-03-17</small> <a href="https://qwerty.work/blog/2025/03/build-a-onedrive-alternative.php">【WebDAV】無料で構築するOneDriveの代替手段</a>' + '</li>' + '<li>' + '<small>2025-02-05</small> <a href="https://qwerty.work/blog/2025/02/filemaker-powershell-image.php">【FileMaker】PowerShell連携で画像回転とExif情報を削除</a>' + '</li>' + '</ul>' ) |
これをHTMLから以下のように読みこんで表示させます。
< script type = "text/javascript" src = "newBlogList.php" ></ script > |
すると以下のように表示されます。
- 2025-04-19 Cloudflare Workers + Prerender.io で CSRサイトを SEO 対応する方法
- 2025-04-15 STUDIOで制作したサイトがBingにインデックスされない問題
- 2025-03-20 【DNS】メールを送るだけでSPFとDKIMのチェックができるテストサイト
- 2025-03-17 【WebDAV】無料で構築するOneDriveの代替手段
- 2025-02-05 【FileMaker】PowerShell連携で画像回転とExif情報を削除