jQueryでRSSを表示する際の日付の記述方法は

Question

jQueryでRSSを表示する際の、日付の記述方法を教えてください。

現状はこんな感じです。

<script>
$.ajax({
	url: 'http://www.example.com/blog/?feed=rss2',
	type: 'get',
	dataType: 'xml',
	timeout: 5000,
	success: function(xml, status) {
		if (status === 'success') {
			var row = 0;
			var data = [];
			var nodeName;
			$(xml).find('item').each(function() {
				data[row] = {};
				$(this).children().each(function() { 
				    nodeName = $(this)[0].nodeName;
				    data[row][nodeName] = {}; 
				    attributes = $(this)[0].attributes;
				    for (var i in attributes) {
						data[row][nodeName][attributes[i].name] = attributes[i].value;
				    }
					data[row][nodeName]['text'] = $(this).text();
				});
				row++;
			});
			$('#feed').wrapInner('<ul></ul>');
			for (i in data) {
			    $('#feed').find('ul').append('<li><strong><a href="' + data[i].link.text + '">' + data[i].title.text + '</a></strong><br><a href="' + data[i].link.text + '">' + data[i].description.text + '</a><hr></li>');
			}
		}
	}  
});
</script>

data[i].description.text の次を改行させ、日付を表示させたい。

Comments

[namimon]

xml内の日付データの名前は分かりますか？

[hizirida]

分かりません

Answer 1

RSSの書式は分かりませんが、

 data[i].pubdate.text 

と推察します。

console.log(data[i]);

をfor(i in data)に仕込んめば内部構造は分かりますよ。

結構ややこしくなっていますけどｗ

RSSの例もあげた方が回答を得られやすいですね。

Comments

[hizirida]

すみません。この手は苦手なもので理解できません。
RSSはwordpress です。

参考にしたページはこちらです。
http://on-ze.com/archives/5043

[退会済みユーザー]

完璧ですね。　 data[i].pubdate.textか data[i].pubDate.text を
$('#feed').find('ul').append(　の末にでも書いてみてください

[hizirida]

data[i].pubDate.text で表示されるようになりました。

がぁ、こんな感じに表示されます。
Sat, 14 Jan 2017 10:02:36 +0000

書式を変更することは可能ですかね。
例えば「2017年1月18日」な感じに

[退会済みユーザー]

```JavaScript
var strDate = "Sat, 14 Jan 2017 10:02:36 +0000";
var date = new Date(strDate);
var fdate = (dateFormat(date)); // これを出力します。

// dateFormat 関数の定義
// http://tacamy.hatenablog.com/entry/2013/03/14/220831
function dateFormat(date) {
var y = date.getFullYear();
var m = date.getMonth() + 1;
var d = date.getDate();
var w = date.getDay();

m = ('0' + m).slice(-2);
d = ('0' + d).slice(-2);

// フォーマット整形済みの文字列を戻り値にする
return y + '年' + m + '月' + d + '日';
}
```
fdate　を$('#feed').find('ul').append(　の末にでも書いてみてください

[hizirida]

すみません。
どこに何を追記してよいか分かりません。

Answer 2

類似質問
jQuery ajaxでrssを読み込む際の日付表示について

Comments

[hizirida]

リンク先の追記と同じようにしましたが、うまく表示できませんでした。

<script>
function formatDt(dt_string) {
var dt = new Date(dt_string);
var y = dt.getFullYear();
var m = ('00' + (dt.getMonth() + 1)).slice(-2);
var d = ('00' + dt.getDate()).slice(-2);
return y + '.' + m + '.' + d;
}

$.ajax({
url: 'http://xxxx/blog/?feed=rss2',
type: 'get',
dataType: 'xml',
timeout: 5000,
success: function (xml, status) {
if (status === 'success') {
var row = 0;
var data = [];
var nodeName;
$(xml).find('item').each(function () {
data[row] = {};
$(this).children().each(function () { // 子要素を取得
nodeName = $(this)[0].nodeName; // 要素名
data[row][nodeName] = {}; // 初期化
attributes = $(this)[0].attributes; // 属性を取得
for (var i in attributes) {
data[row][nodeName][attributes[i].name] = attributes[i].value; // 属性名 = 値
}
data[row][nodeName]['text'] = $(this).text();
});
row++;
});
$('#rss').wrapInner('<ul></ul>');
for (i in data) {
$('#rss').find('ul').append('<li><p>' + formatDt(data[i].pubDate.text) + '</p><a href="' + data[i].link.text + '">' + data[i].title.text + '</a></li>');
}
}
}
});
</script>

[退会済みユーザー]

基礎文法くらいは最低わかっていないと、理解はできないでしょうね…

[hizirida]

ってことは、取り組んでも無駄ってことですかね・・・

[退会済みユーザー]

目的次第だと思います。動きさえすれば理解しなくたっていい場合と、プログラミングを理解して技術を身に付けたいのか、それ次第ですね。

[hizirida]

では、プログラミングを理解して技術を身に付けてから質問したほうが良いということ？

[退会済みユーザー]

プログラミングを理解する目的で質問するのなら歓迎ですよ。

[退会済みユーザー]

「デベロッパーツール」http://www.buildinsider.net/web/chromedevtools/01
をつかって、エラーが出ていないかどうかを確認してください。

Answer 3

書くことが多くなりましたので別に書かせていただきます。

<script>
$.ajax({
    url: 'http://www.example.com/blog/?feed=rss2',
    type: 'get',
    dataType: 'xml',
    timeout: 5000,
    success: function(xml, status) {
        if (status === 'success') {
            var row = 0;
            var data = [];
            var nodeName;
            $(xml).find('item').each(function() {
                data[row] = {};
                $(this).children().each(function() { 
                    nodeName = $(this)[0].nodeName;
                    data[row][nodeName] = {}; 
                    attributes = $(this)[0].attributes;
                    for (var i in attributes) {
                        data[row][nodeName][attributes[i].name] = attributes[i].value;
                    }
                    data[row][nodeName]['text'] = $(this).text();
                });
                row++;
            });
            $('#feed').wrapInner('<ul></ul>');
            for (i in data) {
                var update = data[i].pubdate.text;
                var date = new Date(update);
                var update = dateFormat(date); // ← これを下のappend内に記述する

                $('#feed').find('ul').append('<li><strong><a href="' + data[i].link.text + '">' + data[i].title.text + '</a></strong><br><a href="' + data[i].link.text + '">' + data[i].description.text + '</a><hr></li>');
            }
        }
    }  
});



// dateFormat 関数の定義
// http://tacamy.hatenablog.com/entry/2013/03/14/220831
function dateFormat(date) {
var y = date.getFullYear();
var m = date.getMonth() + 1;
var d = date.getDate();
var w = date.getDay();

m = ('0' + m).slice(-2);
d = ('0' + d).slice(-2);

// フォーマット整形済みの文字列を戻り値にする
return y + '年' + m + '月' + d + '日';
}

</script>

            var update = dateFormat(date); // ← これを下のappend内に記述する

            $('#feed').find('ul').append('<li><strong><a href="' + data[i].link.text + '">' + data[i].title.text + '</a></strong><br><a href="' + data[i].link.text + '">' + data[i].description.text + '</a><hr></li>');

の部分のupdateをfeedのappendのお好きなところに登録してみてください。

Comments

[hizirida]

無知なものですんません。

指摘していただいたところを変更しました。

<script>
$.ajax({
url: 'http://www.example.com/blog/?feed=rss2',
type: 'get',
dataType: 'xml',
timeout: 5000,
success: function(xml, status) {
if (status === 'success') {
var row = 0;
var data = [];
var nodeName;
$(xml).find('item').each(function() {
data[row] = {};
$(this).children().each(function() {
nodeName = $(this)[0].nodeName;
data[row][nodeName] = {};
attributes = $(this)[0].attributes;
for (var i in attributes) {
data[row][nodeName][attributes[i].name] = attributes[i].value;
}
data[row][nodeName]['text'] = $(this).text();
});
row++;
});
$('#feed').wrapInner('<ul></ul>');
for (i in data) {
var update = data[i].pubDate.text;
var date = new Date(update);
var update = dateFormat(date);
$('#feed').find('ul').append('<li><a href="' + data[i].link.text + '">' + data[i].title.text + '</a><br><a href="' + data[i].link.text + '">' + data[i].description.text + '</a><br>' + data[i].pubDate.text + '<hr></li>');
}
}
}
});
function dateFormat(date) {
var y = date.getFullYear();
var m = date.getMonth() + 1;
var d = date.getDate();
var w = date.getDay();

m = ('0' + m).slice(-2);
d = ('0' + d).slice(-2);

// フォーマット整形済みの文字列を戻り値にする
return y + '年' + m + '月' + d + '日';
}
</script>

が、何も表示されなくなりました。

で、下記を

var update = data[i].pubdate.text;
↓
var update = data[i].pubDate.text;

に変更してみると、

Sat, 31 Dec 2016 09:25:03 +0000

と表示されます。

どこが間違ってますかね。

[退会済みユーザー]

$('#feed').find 内の data[i].pubDate.textのところをupdate と変更してみてください

[hizirida]

できました！
今までの追記コードは変更した書式をupdateに置き換えるってことだったんですね。
気付くのおせーよって感です。ｳﾌﾌ
あいがとうございます。