-1

私はウェブ開発が初めてです。ディレクトリに含まれるすべての *.html ファイルを一覧表示するリストのようなコンテナーを使用して Web ページを作成しようとしています。これらのリストされた名前の 1 つをマウスでクリックすると、同じページの別のコンテナーに .html が表示されます。

.html ファイルのファイル名を csv または json ファイルに保存して、javascript を読みやすくし、リストのようなコンテナーに入力しやすくすることを考えています。

これを達成する方法についての指針を本当に感謝します。

ありがとう。

4

2 に答える 2

0

Look at the this question

You can read the list of HTMLs from JSON and display them as list and then follow this question to load the content in the same page

于 2013-05-20T15:12:30.207 に答える
0

ファイル/csvを読み取り、データをフロントエンドに提供するには、サーバー側の優れたソリューションが必要です-ノードをソリューションとして使用することもできます-しかし、これらのトピックは両方ともここでは範囲外です(少なくとも、私はおそらく.それらに答えるのに最適な人ではなく、私が与える答えはさらに多くの質問につながるでしょう)。

フロントエンドのビットを実行するには、jQuery を使用する必要があります。jQuery を使用すると、多くのことが単純化されます。

json文字列（おそらくこの場合は単なる配列）を取得し、次のように膨張/解析する場合：

解析された JSON:

files = [
  'file1.html',
  'file2.html',
  ...etc...
];

次のように、これらを空の既存の UL 要素にプッシュできます。

HTML:

<ul id="list"></ul>
<div id="pageHTML"></div>

Javascript/jQuery:

$(document).ready(function() {

    var $list = $('#list'),
        $html = $('#pageHTML');

    for(var i = 0; i < files.length; i++){
       $list.append('<li><a href="/path/to/'+files[i]+'">'+files[i]+'</a></li>');
    }

    // when a link is clicked, we can load the content via ajax
    $list.on('click', 'a', function(e){
        e.preventDefault();
        $html.load(this.href);
    });

});

Jquery は、@NullPointerException の回答にリンクされている標準の JavaScript バージョンと比較して、ここで何が起こっているのかを簡素化し、読みやすくします。

XMLHTTPRequest も非常に複雑なフィールドです。新しい開発者として、「独自の」ソリューションを作成しようとすると、途中で多くの潜在的な落とし穴があります。おそらく、jQuery に面倒な作業を任せたほうがよいでしょう。

于 2013-05-20T15:28:17.960 に答える