PHP から JavaScript に変数とデータを渡すにはどうすればよいですか?
P粉369196603
2023-08-27 12:05:35
<p>PHP に変数があり、JavaScript コードでその値が必要です。変数を PHP から JavaScript に変換するにはどうすればよいですか? </p>
<p>私のコードは次のようになります:</p>
<pre class="brush:php;toolbar:false;"><?php
$val = $myService->getValue(); // API とデータベース呼び出しを行います
</pre>
<p>同じページに、<code>$val</code> 変数の値をパラメータとして渡す必要がある JavaScript コードがあります。
<pre class="brush:js;toolbar:false;"><script>
myPlugin.start($val); // 試してみましたが、うまくいきませんでした
<?php myPlugin.start($val); ?> // これもうまくいきませんでした
myPlugin.start(<?=$val?>); // これはうまくいくこともありますが、失敗することもあります
</スクリプト>
</pre>
<p><br /></p>
私は通常、HTML で data-* 属性を使用します。
リーリーこの例では jQuery を使用していますが、他のライブラリやプレーンな JavaScript にも適用できます。
データセットのプロパティの詳細については、こちらをご覧ください: https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.dataset
これを行うには実際にはいくつかの方法があります。他のものよりも多くのオーバーヘッドを必要とするものや、他のものよりも優れていると考えられるものもあります。
名前は順番にリストされていません:
この記事では、上記の各方法を検討し、それぞれの方法の長所と短所、およびそれらの実装方法を理解します。
###1。 AJAX を使用してサーバーから必要なデータを取得しますため、この方法が最適であると考えられています。 ###アドバンテージ###
レイヤー間の分離の改善
- 明日、PHP の使用をやめて、サーブレット、REST API、またはその他のサービスに移行したい場合、JavaScript コードをあまり変更する必要はありません。遅延
- AJAX は HTTP リクエストを作成し、HTTP リクエストはネットワーク遅延を伴いながらネットワーク上を移動します。リーリー
index.php (または実際のページの名前)リーリー
上記 2 つのファイルを組み合わせると、ファイルの読み込みが完了するとアラート42
が鳴ります。フェッチ API の使用
高速- - DOM 操作は一般に高速で、大量のデータを比較的迅速に保存したりアクセスしたりできます。
欠点
潜在的に非セマンティック マークアップ- - inputNode を超えた情報を取得する方が簡単であるため、通常は、ある種の
ソース コードをいじる - - PHP で生成されたデータは HTML ソース コードに直接出力されます。つまり、より大きくて焦点が絞られていない HTML ソース コードが得られることになります。
構造化データの取得は困難です- - 構造化データは有効な HTML である必要があります。それ以外の場合は、文字列を自分でエスケープして変換する必要があります。
PHP とデータ ロジックを緊密に結合する- - PHP はプレゼンテーションに使用されるため、この 2 つを完全に分離することはできません。
実装例
を使用して情報を保存します。 value
ですが、これを行うと、HTML 内に意味のない要素が存在することになります。 HTML には、ドキュメントに関するデータを表す要素があり、HTML 5 では、特に JavaScript で使用するために、特定の要素の読み取りデータに関連付けることができる data-*
属性が導入されました。 。これにより、ユーザーには表示されないが JavaScript には表示される、ある種の要素を作成することが考えられます。
index.php
リーリー ###3。データを JavaScript に直接エコーする###アドバンテージ###
実装が非常に簡単- 実装と理解にほとんど時間がかかりません。
- PHP はプレゼンテーションに使用されるため、この 2 つを完全に分離することはできません。