json-ldアプリケーションにjavascript変数を含める

Question

このスクリプトで何が間違っているか教えてください。私はこのページでそれを見つけたhttps://jsfiddle.net/iRbouh/9po7dtg4/しかし、私のウェブサイトでは動作しません。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 


<script id="myJSONID" type="application/ld+json"></script> 

<script type="text/javascript"> 
window.onload=function(){ 
var myList = []; 

function buildMyList() { 
    return ["2 items", "3items", "so on"]; 
} 

$("#myJSONID").text(function() { 
    return JSON.stringify({ 
     "@context": "http://schema.org/", 
     "@type": "Recipe", 
     "recipeIngredient": buildMyList() 
    }); 
}); 

} 

</script> 

テストページは、（あなたがソースを表示しなければならない）、ここで

http://www.al-hamdoulillah.com/horaires-prieres/test.html 

結果は次のようになります。

<script id="myJSONID" type="application/ld+json"> 

{"@context":"http://schema.org/", 
"@type":"Recipe", 
"recipeIngredient":["2 items","3items","so on"] 

}</script> 

しかし、ページがロードされたとき、myJSONIDがまだ空であります：

<script id="myJSONID" type="application/ld+json"></script> 

これはスクリーンショットですコンソールに結果F：

See the screenshot

Answer 1

JavaScriptでDOMは、ページのソースコードを変更しません変更。これはメモリ内のDOMのみを変更します。

DOMインスペクタツール（Chromeの開発ツールの[要素]パネルなど）でページを検査すると、コードがDOMを正常に変更することがわかります。

ソースを表示しても変化は見られませんが、これは予想される動作です。