BH | |
---|---|
Típusú | sablon motor |
Fejlesztő | BEM közösség |
Beírva | JS , PHP (hivatalos verziók) |
Operációs rendszer | Többplatformos szoftver |
Engedély | MIT licenc |
Weboldal | bem.github.io/bh |
A BH ( B EM H TML ) egy fordítói deklaratív sablonmotor JS - hez .
A BH lehetővé teszi a DOM-fa csomópontjainak módosítását a CSS -hez hasonlóan - deklaratív formában.
JS nyilatkozat birtokában :
bh . match ( 'button' , function ( ctx ) { ctx . tag ( 'button' ); }); bh . match ( 'button_legacy' , function ( ctx , json ) { ctx . tag ( 'input' ); ctx . attr ( 'type' , 'button' ); ctx . attr ( 'value' , json . content ); }) ; bh . match ( 'button_submit' , function ( ctx , json ) { ctx . tag ( 'input' ); ctx . attr ( 'type' , 'submit' ); ctx . attr ( 'value' , json . content ); }) ;Vagy egy hasonló deklaráció PHP szintaxisban :
$bh -> match ( 'button' , function ( $ctx ) { $ctx -> tag ( 'button' ); }); $bh -> match ( 'button_legacy' , function ( $ctx , $json ) { $ctx -> tag ( 'input' ); $ctx -> attr ( 'type' , 'button' ); $ctx -> attr ( 'érték' , $json -> tartalom ); }); $bh -> match ( 'button_submit' , function ( $ctx , $json ) { $ctx -> tag ( 'input' ); $ctx -> attr ( 'type' , 'submit' ); $ctx -> attr ( 'érték' , $json -> tartalom ); });És bevitt adatok:
[ { "block" : "button" , "content" : "Csak egy gomb" }, { "block" : "button" , "mods" : { "submit" : true }, "content" : "Küldés gomb" } , { "block" : "button" , "mods" : { "legacy" : true }, "content" : "Legacy button" }, { "block" : "button" , "mods" : { "legacy" : true , "submit" : true }, "content" : "Régi stílusú küldés gomb" } ]Megkapjuk az eredményt:
< button class = "button" > Csak egy gomb </ button > < input class = "button button_submit" type = "submit" value = "Küldés gomb" /> < input class = "button button_legacy" type = "button" value = "Régi gomb" /> < input class = "button button_legacy button_submit" type = "submit" value = "Régi stílusú küldés gomb" />A BH hivatalos implementációi JavaScript és PHP nyelven íródnak .