Динамическое добавление и удаление схемы JSON

#jquery #schema

Вопрос:

У меня есть коллекция страниц — некоторые с видео, некоторые без. Я хочу динамически добавлять схему видеообъекта, если видео существует на странице.

Схема JSON

 <script type="application/ld json">
{
  "@context":"https://schema.org",
  "@graph": [
  {
    "@type": "VideoObject",
    "name": "XXXXXXXX",
    "description": "XXXXXXXX",
      "thumbnailUrl": [
        "XXXXXXXX",
        "XXXXXXXX",
        "XXXXXXXX"
       ],
       "author": {
            "@type": "Person",
            "name": "XXXXXXXX"
       },
       "publisher": {
        "@type": "Organization",
        "name": "XXXXXXXX",
        "logo": {
        "@type": "ImageObject",
        "name": "XXXXXXXX",
        "url": "XXXXXXXX",
        "width": 1200,
        "height": 257
        }
        },
       "uploadDate": "XXXXXXXX",
       "contentUrl": "XXXXXXXX",
       "embedUrl": "XXXXXXXX"
   }
     ]
  }
 

Я перепробовал так много вариантов, включая jQuery (ограничен тем, что я могу использовать с Webflow). Ниже была моя попытка очистить содержимое div, содержащего схему json, если div YouTube был скрыт (Webflow присваивает ему класс «w-условие-невидимо». Это не сработало.

 if ($("#youtube-video-1").hasClass("w-condition-invisible")) { 
  $(".html-dynamic-1").empty();
}
 

Ответ №1:

Это работает!

 <script>
if (!$("#youtube-video-1").hasClass("w-condition-invisible")) { // If YouTube video has been added, include the following Schema

  var schema = {
  "@context":"https://schema.org",
  "@graph": [
  {
    "@type": "VideoObject",
    "name": "XXXXXXX",
    "description": "XXXXXXX",
      "thumbnailUrl": [
        "XXXXXXX",
        "hXXXXXXX",
        "XXXXXXX"
       ],
       "author": {
            "@type": "Person",
            "name": "XXXXXXX"
       },
       "publisher": {
        "@type": "Organization",
        "name": "XXXXXXX",
        "logo": {
        "@type": "ImageObject",
        "name": "XXXXXXX",
        "url": "XXXXXXX",
        "width": 1200,
        "height": 257
        }
        },
       "uploadDate": "XXXXXXX",
       "contentUrl": "XXXXXXX",
       "embedUrl": "XXXXXXX"
   }
     ]
  }    
      var script = document.createElement('script');
        script.type = "application/ld json";
        script.text = JSON.stringify(schema);

        document.querySelector('body').appendChild(script);
        
}        
</script>