Можно ли выполнить некоторые манипуляции с DOM на стороне клиента до того, как документ будет готов?

Я пытаюсь найти способ (если возможно) использовать javascript для добавления некоторых атрибутов к элементу во время рендеринга и до полной загрузки DOM. Я знаю, это звучит контрпродуктивно, но позвольте мне дать вам некоторую предысторию:

  • Я работаю на чрезвычайно ограниченной платформе шаблонов, которая дает мне доступ к некоторым переменным страницы, но им нужны небольшие манипуляции со строками. Я не могу использовать какую-либо предварительную обработку ASP, поэтому это должно происходить на стороне клиента.
  • В частности, я пытаюсь добавить разметку микроданных Schema.org к элементу до робота Googlebot, который просматривает содержимое документа.
  • По сути, мне нужно изменить значение атрибута с $5.99 на 5.99.

Вот моя последняя попытка, которая делает модификации DOM правильно, но не раньше, чем валидатор расширенного фрагмента Google обработает страницу:

<div class="pitinfo"><div class="padleft padright"><%Product.BasePrice%></div></div>

<!-- at page bottom -->
<script type="text/javascript">
    (function() {
        var pricesting = "<%Product.BasePrice%>";
        var price =  pricesting.slice(1);
        $('.pitinfo').attr('itemprop', 'price');
        $('.pitinfo').attr('content', price);
    })();
</script>

После загрузки я получаю это <div class="pitinfo" itemprop="price" content="9.99">$9.99</div>, однако инструмент Rich Snippet Testing сообщает мне, что price не установлено.

Я уже пытался использовать ASP в своем коде шаблона, но хостинг-провайдер не разрешает это.

Можно ли внести изменения в DOM где-то в середине потока рендеринга документа?


javascript jquery dom google-rich-snippets googlebot
person tshimkus    schedule 30.03.2019    source источник
comment
Любопытно, почему вы не делаете это на стороне сервера?   -  person charlietfl    schedule 30.03.2019
comment
@charlietfl Это невозможно. Я застрял внутри механизма шаблонов черного ящика, который не позволяет получить прямой доступ к ASP.   -  person tshimkus    schedule 30.03.2019
comment
Возможно, API расширенного фрагмента просматривает только то, что находится в исходном коде сервера, и не ждет обновлений javascript. Или требуется какой-то метатег, чтобы сначала запустить javascript. Если это последнее, вы не сможете изменить голову ни на одной стороне сервера.   -  person charlietfl    schedule 30.03.2019
comment
Протестируйте с помощью инструмента проверки URL-адресов Google Search Console, который теперь сообщает о разметке продукта и отображает страницу так же, как это делает Googlebot. Бьюсь об заклад, ваше редактирование работает там.   -  person Tony McCreath    schedule 30.03.2019
comment
@TonyMcCreath, это сработало! Я не знал, что инструмент проверки расширенных фрагментов работает иначе, чем инспектор URL-адресов Search Console.   -  person tshimkus    schedule 31.03.2019

Ответы (1)


arrow_upward
0
arrow_downward

Внутри тега <body> можно вставить тег <script>. JavaScript внутри тега загружается перед HTML после него, поэтому вы сможете редактировать значение элемента до загрузки остальной части HTML/JS.
Например:

<body>
    <div id="element" value="$5.99"></div>
    <script>
        var element = document.getElementById("element")
        element.value = 5.99;
    </script>
</body>

Вы можете проверить это здесь

person Greyson R.    schedule 30.03.2019