そこで、ここに示されている photobooth という JavaScript アプリケーションを使用しています: PhotoBooth と、ここに抜粋された顔検出スクリプトを使用しています:顔検出
それを使用するには、要素 ID を指定する必要があります. JavaScript アプリの要素 ID がどうなるかは、一生わかりません. ですから、すべてを Div ヘッダーに入れ、ID を与えるか、または誰かがソースをデコードして、キャンバスレイヤーが何と呼ばれているかを理解するのを手伝ってくれますか?
JavaScriptをdivに入れません。スクリプトは、それ自体をインストールするための div を識別することを期待しています。
次のように、ページに div を配置するだけです。
<div id="example"></div>
次に、JavaScriptで：
// with jQuery
$("#example").photobooth();
// or, standalone example without jQuery
var myPhotobooth = new Photobooth(document.getElementById( "example"));
...そしてドキュメントに従ってください。
私はこれだけで動作しますが、既存の要素を指定する場合は、少なくとも 200x200 ピクセルの寸法が必要であることに注意してください。そうしないと、Photobooth でエラーが発生します。