ホームページお作りします

昨日の続きです。

現在完成しているソースに昨日のHTMLを組み込んでいきます。
まずはHTMLで書かれている部分を抽出してみましょう。
htmlstrで始まる行がHTMLソースをあらわしています。

<JavaScriptソース抜粋>
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
htmlstr += '<h3><a href="' + entry.link + '">' + entry.title + '</a></h3>';
var imgCheck = entry.content.match(/(src="http:)[S]+((.jpg)|(.gif)|(.png))"/);
if(imgCheck){
htmlstr += '<img ' + imgCheck[0] + ' width=120>';
}
htmlstr += '<p>' + entry.contentSnippet.substring(0, 150) + '</p>';
var strdate = createDateString(entry.publishedDate);
htmlstr +='<p>' + strdate + '</p>';
}

意外にHTML部分は少ないのが判ります。
抜き出してみましょう。

<h3><a href="entry.linkの中身">entry.titleの中身</a></h3>
<img src="http:抜き出した画像のURL" width=120>
<p>entry.contentSnippet.substring(0,150)</p>
<p>strdate</p>

ここに昨日のソースを追加します。

<div class="rss_entry">
<div class="rss_title"><h3><a href="entry.linkの中身">entry.titleの中身</a></h3></div>
<div class="rss_main">
<div class="rss_img"><img src="http:抜き出した画像のURL" width=120></div>
<div class="rss_content"><p>entry.contentSnippet.substring(0,150)</p>
<p>strdate</p></div>
<div class="clear"><hr></div>
</div> <!-- rss_main -->
</div> <!-- rss_entry -->

CSSでホームページを作っておられる方なら難しくはないですね^^
これを元のソースに戻します。

google.load("feeds", "1");
function initialize() {
var feedurl = "ブログのRSSから広告除去したURL";
var feed = new google.feeds.Feed(feedurl);
feed.setNumEntries(5);
feed.load(function (result){

if (!result.error){
var container = document.getElementById("feed");
var htmlstr = "";
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];



htmlstr +='<div class="rss_entry">';
htmlstr +='<div class="rss_title"><h3><a href="' + entry.link + '">' + entry.title + '</a></h3></div>';
htmlstr +='<div class="rss_main">';
var imgCheck = entry.content.match(/(src="http:)[S]+((.jpg)|(.gif)|(.png))"/);
if(imgCheck){
htmlstr += '<div class="rss_img">;<img ' + imgCheck[0] + ' width=120></div>';
}

htmlstr +='<div class="rss_content">';
htmlstr += '<p>' + entry.contentSnippet.substring(0, 150) + '</p>';
var strdate = createDateString(entry.publishedDate);
htmlstr += '<p>' + strdate + '</p></div>';
htmlstr +='<div class="clear"><hr></div>';
htmlstr +='</div></div>';
}

container.innerHTML = htmlstr;
}else{
alert(result.error.code + ":" + result.error.message);
}
});
}

function createDateString(publishedDate){
var pdate = new Date(publishedDate);
var pday = pdate.getDate();
var pmonth = pdate.getMonth()+1;
var pyear = pdate.getYear();
if(pyear < 2000){pyear = pyear+1900} ;
var strdate = pyear + "年" + pmonth + "月" + pday + "日";
return strdate;
}

google.setOnLoadCallback(initialize);



画像があってもなくても同じように表示されるようになりました。