ここから本文です

Javascriptで関連記事の表示をしようとしています。

nova27さん

2018/9/1722:27:32

Javascriptで関連記事の表示をしようとしています。

事前にカテゴリを三次元配列として用意して、for文で呼び出したhtmlがどのカテゴリに該当するか調べて、そのカテゴリに含まれているページを二次元配列(ページのURLとサムネイル)で返すというプログラムを作ろうとしています。

下のようなコードを書いたのですが、画面に表示される文字がURLではなく、undefinedになります。

どのようなコードを書けば良いのでしょうか?

ブラウザ : GoogleChrome
htmlのパス : file:///D:/user1234/Documents/フォルダ/ホームページ/parts/index.html
jsのパス : file:///D:/user1234/Documents/フォルダ/ホームページ/parts/○○.js
(プライバシー保護のため、一部文字を変更しています)

index.html
---------------------------------------------------------------------------------------------------------------------------
<html>

<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>JavaScript 関連記事</title>
<script type="text/javascript" src="Category_list.js"></script>
<script type="text/javascript" src="Related_article.js"></script>
</head>

<body>

<script>
<!--ここで関数呼び出し-->
related_article("file:///D:/user1234/Documents/フォルダ/ホームページ/");
</script>

</body>
</html>
-----------------------------------------------------------------------------------------------------------------------

Category_list.js
カテゴリをまとめた三次元配列
----------------------------------------------------------------------------------------------------------------------
function category_list() {
var list = [
[
["index.html", "parts/header_img.jpg"]
],
[
["test/index.html", "test/foo.jpeg"],
["test/hogehoge/index.html", ""]
],
[
["parts/index.html", "test/foo.jpeg"]
]
];

return list;
}
----------------------------------------------------------------------------------------------------------------

Related_article.js
---------------------------------------------------------------------------------------------------------------
function get_page_array (domain) {
//カテゴリリストを取得
var cat_list = category_list();
//カテゴリの数を取得
var num_of_cat = cat_list.length;

//カテゴリごとに調べる
for (var c = 0; c <= (num_of_cat-1); c++) {
var page_list = cat_list[c];
var num_of_page = page_list.length;

//ページごとに調べる
for (var p = 0; p <= (num_of_page-1); p++) {
var page_path = domain + page_list[p][0];
//ファイルのURL(パス)とカテゴリに書かれたURLが一致すれば
//そのカテゴリのページリストを返す
if (location.href == page_path) {
return page_list;
}
}
}
}

function related_article (domain) {
var related_array = get_page_array(domain);

//undefinedになる
document.write(related_array);
}
-----------------------------------------------------------------------------------------------------------------------

閲覧数:
47
回答数:
2
お礼:
500枚

違反報告

ベストアンサーに選ばれた回答

cap********さん

2018/9/1823:50:18

if (location.href == page_path) {
の手前に
console.log( page_path, location.href );
を入れてみたところ、location.hrefはURLエンコードされているのに対し、
page_pathは日本語(マルチバイト文字)のままでした。


page_pathは以下でした。
file:///D:/user1234/Documents/フォルダ/ホームページ/index.html

location.hrefは以下でした。
file:///D:/user1234/Documents/%E3%83%95%E3%82%A9%E3%83%AB%E3%83%80/%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8/index.html


なので
if (location.href == page_path) {

if (location.href == encodeURI(page_path)) {
if (decodeURI(location.href) == page_path) {
のどちらかで正しく動作しました。

ベストアンサー以外の回答

1〜1件/1件中

2018/9/1810:56:21

ぷらいばしーほごのためにあんごうかしたぷろぐらむをかくといいだろうね

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。

不適切な投稿でないことを報告しました。

閉じる