jQueryによるRSSの取得で日付表示の際、エラーが出る

Question

別ドメイン（jugemブログ）のRSSをjQueryにて取得＆表示させるということを試みております。

RSSの取得表示のコードは下記の通りです。

      $(function(){
        $.ajax({
          url: 'rss.php',
          xmlType: 'xml',
		  cache: false,
          success: function(xml) {
 
              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();
					
				$(this).find('date,dc\\:date').each(function() {
					
					var pubtime = $(this).text();
					pubtime = new Date(pubtime);
					data[row].pubDate = pubtime.replace(/(\d+-\d+-\d+)T(\d+:\d+).+/,function(a,b,c) {
							return b.replace(/-/g, '/') + ' ' + c;
						});
					});
					
                });
                row++;
              });
              for (i in data) {
				  
				  console.log (data[i]);
                  $('#feed').append('<p>'+ data[i].pubDate +'</p><h3><a href="' + data[i].link.text + '" target="_blank">'+ data[i].title.text +'</a></h3>');
              }
          }
        });
      });
</script>

タイトルは取得に成功しているのですが、日付はdc:dateという要素に入っているためか、
日付の出力で「undefined」と出てしまいます。 これは調べてみると”未定義”ということらしいのですが、なぜ未定義なのかがわかりません。。

そしてWebデベロッパーツールのコンソールを開くと一点エラーが出ていました。それが下記のようなものです。「sun_raft is not defined」というのは見たことも聞いたこともなく、情報を調べても全くヒットせず、、どうか皆様の力をお借りしたいと思った次第です。

【エラー内容】

VM13268:1 Uncaught ReferenceError: sun_raft is not defined
    at <anonymous>:1:1
(anonymous) @ VM13268:1
setTimeout (async)
cloud @ all.js:78
animation @ all.js:53
(anonymous) @ VM13267:1
setTimeout (async)
(anonymous) @ all.js:49
i @ jquery.min.js:2
fireWith @ jquery.min.js:2
ready @ jquery.min.js:2
K @ jquery.min.js:2

主に参考にしたブログはこちらです。
http://blog.embellir-design.com/article/JQuery_RSS.html?seesaa_related=category

何卒宜しくお願い致しますm(__)m

【追記①】

ご質問頂きました件です。

success: function(xml) {
の直後で
console.log (xml);
として確認いたしました。

確かにタイトルやリンク、日付など、必要なRSSフィード情報が全て入っておりました。

またPHPの動作環境は整っております。

ちなみにPHPファイル（rss.php）の中身は下記のようになっております。

<?php
$url = "URLが入っています";
$xml = file_get_contents($url);
header("Content-type: application/xml; charset=UTF-8");
print $xml;
?>

【追記②】

$(this).find('date,dc\:date').each(function() {

の後でconsole.log($(this)); をしても何も返ってきていないようでした。
もしかして、ヒットすらしていないということでしょか？

Comments

[m.ts10806]

success　時点でxmlをコンソール出力すると想定した情報が取得できていますか？また、rss.phpの内容は参照先と変更ありませんか？（あとPHP動作環境はできていますか？）

[lenlen]

有難うございます！m(__)m　ご質問頂いた点について追記を致しました。何卒宜しくお願い致します。

Answer 1

日付はdc:dateという要素に入っているため

なら、素直にこれでいいんではないでしょうか？

 $(this).find('dc:date').each(function() {

##追記

jQueryでdc:titleのような : (コロン) があるXMLタグの中身を読む
http://qiita.com/futosu/items/ad61eb7584dc70ccce76

なるほど、\でエスケープと書いてありますね。

ただ、この\エスケープはFirefoxとIE用とも書いてあります。
元表記のコードを、chromeで確認しようとしてたので取得できなくてundefinedだった、とかではありませんか？
このサイトの情報に従って、

$(this).find('date , dc\\:date').each(function() {

とすれば全ブラウザでいけるのではないでしょうか。

Comments

[lenlen]

ご回答有難うございますm(__)m

$(this).find('dc:date').each(function() {　としても、「undefined」となってしまいます。。

：コロンは\\バックスラッシュを入れる必要があるとどこかのサイトで知ったのですが、その必要はないのでしょうか？

[lenlen]

貴重なお知恵を追記頂きありがとうございます！

バックスラッシュのエスケープはFirefoxとIE用だったのですね。
しかし、$(this).find('date , dc\\:date').each(function() {　と記述してもundefinedになっていまいました。
ちなみに全ブラウザでこのようになっております。

[zohnam]

undefinedはどの時点ででていますか？　たとえば、
var pubtime = $(this).text();
console.log(pubtime);
としたとき、予定通りpubtimeは出力されますか？

[lenlen]

console.log(pubtime);とすると何も返っていませんでした！

$(this).find('date,dc\\:date').each(function() {
の中身の全てが実行されていないようです。。

[zohnam]

$(this).find('date,dc\\:date').each(function() {
この$(this)の子要素として、たしかに<dc:date>は存在していますか？
この1行上に、
console.log(["dc",$(this).html(),$(this).find('date,dc\\:date').length]);
と入れたら、どう表示されます？

[lenlen]

本当にご親切に有難うございます。

そのような検証方法があるんですね！下記のように出力されていました。

(3) ["dc", "URLが入っていました", 0]
(3) ["dc", "タイトルが入っていました", 0]
↑
このような並びの中に
["dc", "2014-06-11T17:18:37+09:00", 0]
と日付がはいっていました。

dc:dateがそもそも入っていなかったんですね。。
これを出力するようにしてみます。

[zohnam]

入っていなかったというか、探している場所が深すぎるんじゃないかと疑ってましたが、やはりそうだったようですね。
こういう構造
$(this).children().each(function() {// xmlのitemの子要素全部
の中に
$(this).find('date , dc\\:date').each(function() {
が入ってましたけど、この時点の$(this)のうちのひとつが<dc::date>のはずです。
.find()は「全ての子要素・孫要素など」から探すものですから、「自分自身は対象外」です。
探せないのも当然ですよね。

[lenlen]

あ、そういうことなのですね！＞＜
理解致しました。
子孫がないのに子孫を探していたということですか。なるほどです！

[lenlen]

ここまでご親切にご対応頂きありがとうございました！結果、日付を取得することができましたm(__)m

---------------
$(this).find('date,dc\\:date').each(function() {
var pubtime = $(this).text();
pubtime = new Date(pubtime);
data[row].pubDate = dateFormat(pubtime);
});

おっしゃる通りにこちらの塊を外へ出してやることで、dc:dateを探すことが出来ました。

最後に日付の整形部分で関数未定義エラーが出ていたので、日付の整形は下記の関数を使いました。
------------------------------------
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 + '日';
}
------------------------------------

この度は親切丁寧にコメントを頂き大変助かりましたのでベストアンサーに選ばさせて頂きました。
とても勉強になりました。
ありがとうございました！