web-dev-qa-db-ja.com

JavaScript、ループからのデータを使用するための最良の方法

私はWPテーマ開発を学ぼうとしています。そして現時点では、JavaScriptでループからのデータを使用する方法を見つけようとしています。

Wp_enqueueを使ってロードされた外部のスクリプトファイルの中にいくつかのJavaScript関数があるとしましょう。そして、このスクリプトは投稿用のメタから大量のデータを使用する必要があります。

このデータをループからスクリプトに取り込むためのベストプラクティスは何ですか。スクリプトで使用するグローバルJavaScript配列またはオブジェクトにデータをループアウトする必要がありますか？ 「ベストプラクティス」とは何ですか？私は特に「JavaScriptコードをテンプレートから遠ざけ、外部ファイルからのみ読み込むようにする」ことを考えています。

また、WPでグローバル変数、配列、またはオブジェクトを使用している場合は、ファイルの先頭でこれをコメントアウトする必要があるとの説明もあります。これは正しいです？そしてこのコメントヘッドに正確に何を書くべきですか？

phpjavascriptglobals
2
Alex

WP_Queryを使用して、Wordpressインストールからほとんどすべての投稿データを取得できます。

$sub_pages = new WP_Query(
    array( 
        'post_parent' => 3,
        'post_type' => 'page'
    )
);

print_r($sub_pages->posts);

これにより、次のようになります。

Array
(
    [0] => WP_Post Object
        (
            [ID] => 94
            [post_author] => 1
            [post_date] => 2015-08-20 11:19:27
            [post_date_gmt] => 2015-08-20 10:19:27
            [post_content] => Business operating...

投稿がいっぱいの配列。だからあなたがする必要があるのはこれをJSONでエンコードし、それをスクリプトタグでラップすることです。

<script type="text/javascript">
    var post_info = <?php echo json_encode($sub_pages->posts); ?>;
</script>

これは出力されます：

<script type="text/javascript">
    var post_info = [{"ID":94,"post_author":"1","post_date":"2015-08-20 11:19:27","post_date_gmt":"2015-08-20 10:19:27","post_content":"Business operating

だから今、私が私のJavaScriptをロードする場所の前にこれを置くならば、すなわち。

<script type="text/javascript">
    var post_info = <?php echo json_encode($sub_pages->posts); ?>;
</script>
<script type="text/javascript" src="script.js"></script>

script.jsで私はただ行くことができます

console.log(post_info[0].ID);

そしてコンソールで94を取得します。

2
Djave