Могу ли я отделить область элементов от содержимого?

#javascript #html #reactjs #microdata

Вопрос:

Могу ли я отделить область элементов от содержимого? Учитывая, что будет дублирование, является ли это хорошим решением?

Если да, то как это правильно сделать? Исключение-1 или Исключение-2?

(Я не понимаю, нужно ли вставлять контент в основную область элементов)

Пример-1:

 <head>
...
</head>
<body>
    <!-- user doesn't see this -->
    <div itemscope itemtype="https://schema.org/ScreeningEvent" style="display: none;">
      <h1 itemprop="name">Jaws 3-D"</h1>
      <div itemprop="description">Jaws 3-D shown in 3D.</div>
      <p>Location: <span itemprop="location" itemscope itemtype="https://schema.org/MovieTheater">
        <span itemprop="name">ACME Cinemas 10</span>
        <span itemprop="screenCount">10</span>
        </span>
      </p>
      <div itemprop="workPresented" itemscope itemtype="https://schema.org/Movie">
        <span itemprop="name">Jaws 3-D</span>
        <link itemprop="sameAs" href="www.imdb.com/title/tt0085750/"/>
      </div>
      <p>Language: <span itemprop="inLanguage" content="en">English</span></p>
      <p>Film format: <span itemprop="videoFormat">3D</span></p>

        ...
        
        <!-- next is my content -->
        <h1>Jaws 3-D"</h1>
        <div>Jaws 3-D shown in 3D.</div>
        <div>...and etc</div>

        ...

    </div>

</body> 

или
Пример-2:

 <head>
...
</head>
<body>
    <!-- user doesn't see this -->
    <div itemscope itemtype="https://schema.org/ScreeningEvent" style="display: none;">
      <h1 itemprop="name">Jaws 3-D"</h1>
      <div itemprop="description">Jaws 3-D shown in 3D.</div>
      <p>Location: <span itemprop="location" itemscope itemtype="https://schema.org/MovieTheater">
        <span itemprop="name">ACME Cinemas 10</span>
        <span itemprop="screenCount">10</span>
        </span>
      </p>
      <div itemprop="workPresented" itemscope itemtype="https://schema.org/Movie">
        <span itemprop="name">Jaws 3-D</span>
        <link itemprop="sameAs" href="www.imdb.com/title/tt0085750/"/>
      </div>
      <p>Language: <span itemprop="inLanguage" content="en">English</span></p>
      <p>Film format: <span itemprop="videoFormat">3D</span></p>
    </div>

    ...
    
    <!-- next is my content -->
    <h1>Jaws 3-D"</h1>
    <div>Jaws 3-D shown in 3D.</div>
    <div>...and etc</div>
</body>