PHPを使用してjQueryを使用して動的クラスを作成する方法

Question

PHPスニペットを作成するか、WordPressコードスニペットと見なすことができ、そのモジュールがフロントエンドに読み込まれるたびに動的CSSクラスを作成したいそのクラスはjQueryによってフロントエンドのスタイルに使用されます。ここで

はシナリオです：

が思う初めてモジュールはフロントエンドにロードしてみましょう、それは次のようにクラスを持っている必要があります。module-front-end-123と私はこの中に住んデータに基づいてその内容をスタイルにjQueryのからこの正確なクラスを使用することができますモジュールのみ。

今、同じタイプの別のモジュールが追加されたとします。module-front-end-124のようなクラスを生成する必要があります。このクラスをjQueryから再度使用してスタイリングを再開します。

このアプローチの利点は次のとおりです。コードスニペットを1回だけ作成します。モジュールがロードされると、独自のクラスが取得され、jQueryコードはこのモジュールで動作し、他のモジュールスタイルでは独立して他のモジュールのために働いている。

私はPHPでそのクラスを作成することができますが、jQueryのか、そのような任意のもので、そのクラスを使用する方法がわからない...

誰も私をしてください導くことはできますか？私はちょうど一度だけ自分のスタイルを書いて、フェッチされたクラスに適用されるでしょう。

Answer 1

PHPコードの中には、各コードスニペットが挿入された後に値をインクリメントする任意の変数を使用できます。同様に、以下に示す：

PHPコードのアドオンの上に

：それはちょうど、グローバルスコープの変数を作成し、その空の場合、それは今だけ、この変数を使用し、0パーフェクトに設定します

global $count; 
if $count == '' { $count = 0; } 

あなたのhtmlクラスに、以下に示すよう：

<div class="module-front-end-<?php echo $count;?>">HTML DATA GOES HERE </div> <?php $count++; ?> 

今最初の挿入ではmodule-front-end-0を生成し、第2の挿入にはmodule-front-end-1になるというように、モジュールの各挿入となります。さて、以下に示すように取得データとコードがなりますようにだけ、別のクラスを追加

：

<div class="get-data module-front-end-<?php echo $count;?>">HTML DATA GOES HERE </div> 

だから、あなたのHTML部分は、現在行ってはただのようなコードを追加するには、JSファイル内では、JSの部分に移動します以下に示す：

var count = 0; 
$(".get-data").each(function(){ 
    $('module-front-end-'+count+).append('<p>this is my data</p>'); 
    count = count + 1; 
}): 

この方法で、あなたのために仕事をします。 注：.append('<p>this is my data</p>');は、すべての動的クラスの中にどのように入ることができるかを示す目的の例です。これまでにあなたのコードを使って何をしたいことができるのですか？