Как создать приложение для чтения RSS на JavaScript

RSS (Really Simple Syndication) – это стандартизированный формат, используемый онлайн-издателями для передачи своего контента на другие веб-сайты и сервисы. Документ RSS, также известный как канал, – это документ XML, содержащий контент, который издатель хочет распространять.

RSS-каналы доступны почти на всех новостных веб-сайтах и ​​в блогах, чтобы их читатели всегда были в курсе своего содержания. Их также можно найти на нетекстовых веб-сайтах, таких как YouTube, где вы можете использовать канал канала YouTube для получения информации о последних видео.

Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)

Программы, которые получают доступ к этим каналам, читают и отображают их содержимое, называются программами чтения RSS Вы можете создать простую программу для чтения RSS на JavaScript. В этом уроке мы увидим, как это сделать.
Демоверсия приложения для чтения RSSСтруктура RSS-канала
У RSS-канала есть корневой элемент, который называется , аналогично тег найден в документах HTML. Внутри тег, есть элемент, вроде как в HTML, который включает в себя множество подэлементов, содержащих распределенный контент сайта.

Фид обычно содержит некоторую основную информацию, такую ​​как заголовок, URL и описание веб-сайта, а также отдельные обновленные публикации, статьи или другое содержимое этого веб-сайта. Эта информация находится в,<link>, а также <description> элементы соответственно.</p><p>Когда эти теги непосредственно присутствуют внутри <channel>, они содержат заголовок, URL и описание сайта. Когда они присутствуют внутри <item> который содержит информацию об обновленных сообщениях, они представляют ту же информацию, что и раньше, но информацию об отдельном контенте, который каждый <item> представлять.</p><p>Есть также некоторые дополнительные элементы, которые могут присутствовать в RSS-канале, предоставляя дополнительную информацию, такую ​​как изображения или авторские права на распространяемый контент. Вы можете узнать о них в этой спецификации RSS 2.0 на <a rel="nofollow noopener noreferrer" target="_blank" href="https://cyber.harvard.edu/rss/rss.html">cyber.harvard.edu</a>,</p><p>Вот пример того, как может выглядеть RSS-лента веб-сайта:</p><div class='code-block code-block-2' style='margin: 8px 0; clear: both;'><div id="yandex_rtb_R-A-1243617-2"></div> <script type="litespeed/javascript">window.yaContextCb.push(()=>{Ya.Context.AdvManager.render({renderTo:'yandex_rtb_R-A-1243617-2',blockId:'R-A-1243617-2'})})</script> </div><p><rss version="2.0"><br /> <channel><br /><title>Hongkiathttps://www.hongkiat.com/ Советы по дизайну, учебник и вдохновение
ан-нас

Визуализация любой таблицы стилей CSS с помощью статистики CSS
Когда-нибудь задумывались, сколько правил CSS
      находятся в таблице стилей? Или ты когда-нибудь
      хотел увидеть…
18/05/2017https://www.hongkiat.com/blog/css-stylesheet-with-css-stats/


Amazon Echo Show – новейшее интеллектуальное устройство на базе Alexa
Amazon не привыкать к концепции умного дома
      системы со встроенным цифровым помощником.
      В конце концов, …
17/05/2017https://www.hongkiat.com/blog/alexa-device-amazon-echo-show/


Извлечение корма
Нам нужно получить канал с нашим приложением для чтения RSS. На веб-сайте URL-адрес канала RSS можно найти внутри тег, используя тип приложения / rss + xml. Например, вы найдете следующую ссылку RSS-канала на Hongkiat.com.

Во-первых, давайте посмотрим, как получить URL канала веб-сайта с помощью JavaScript.

fetch (websiteUrl) .then ((res) => {
  res.text (). then ((htmlTxt) => {
    var domParser = новый DOMParser ()
    let doc = domParser.parseFromString (htmlTxt, ‘text / html’)
    var feedUrl = doc.querySelector (‘ссылка[type=”application/rss+xml”]«) .Href
  })
}). catch (() => console.error (‘Ошибка при загрузке сайта’))

выборки () Метод – это глобальный метод, который асинхронно выбирает ресурс. Он принимает URL ресурса в качестве аргумента (URL сайта в нашем коде). Он возвращает объект Promise, поэтому, когда метод успешно извлекает веб-сайт (т. Е. Обещание выполнено), первая функция внутри оператора then () обрабатывает извлеченный ответ (res в приведенном выше коде).

Полученный ответ затем полностью считывается в текстовую строку, используя текст() метод. Этот текст представляет собой HTML-текст нашего загруженного веб-сайта. Как и fetch (), text () также возвращает объект Promise. Таким образом, когда он успешно создает текст ответа из потока ответов, then () будет обрабатывать этот текст ответа (htmlText в приведенном выше коде).

Как только HTML-текст сайта доступен, мы используем DOMParser API разобрать его в документ DOM. DOMParser анализирует текстовую строку XML / HTML в документе DOM. Его метод parseFromString () принимает два аргумента: анализируемый текст и тип содержимого.

Затем из созданного документа DOM мы находим значение href соответствующего тег с помощью querySelector () метод для того, чтобы получить URL-адрес канала.
Разбор и отображение ленты
Как только мы получим URL-адрес канала веб-сайта, нам нужно получить и прочитать документ RSS, найденный по этому URL-адресу.

fetch (feedUrl) .then ((res) => {
  res.text (). then ((xmlTxt) => {
    var domParser = новый DOMParser ()
    let doc = domParser.parseFromString (xmlTxt, ‘text / xml’)
    doc.querySelectorAll (‘item’). forEach ((item) => {
let h1 = document.createElement (‘h1’)
h1.textContent = item.querySelector (‘title’). textContent
document.querySelector ( ‘выход’). AppendChild (h1)
       })
     })
})

Таким же образом, как мы выбирали и анализировали веб-сайт, теперь мы получаем и анализируем XML-канал в DOM-документе. Чтобы достичь этого, мы используем тип содержимого text / xml в методе parseFromString ().

В разобранном документе мы выбираем все элементы, использующие querySelectorAll метод и цикл через каждого.

Внутри каждого элемента мы можем получить доступ к тегам, таким как, <description>, а также<link>, которые несут содержание корма. И наше простое приложение для чтения RSS готово, вы можете стилизовать содержимое выбранных каналов по своему желанию.<br /> Github демо<br /> Вы можете проверить более подробную версию кода, используемого в этом посте в нашем <a rel="nofollow noopener noreferrer" target="_blank" href="https://github.com/hongkiat/js-rss-reader/">Github репо</a>, Более подробная версия выбирает три канала (<a rel="nofollow noopener noreferrer" target="_blank" href="https://hacks.mozilla.org/">Mozilla Hacks</a>Хонгкиат и <a rel="nofollow noopener noreferrer" target="_blank" href="https://webkit.org/blog/">Блог Webkit</a>) с использованием файла JSON, а также добавляет некоторые стили CSS в программу чтения RSS.</p><div class='code-block code-block-5' style='margin: 8px 0; clear: both;'><div id="yandex_rtb_R-A-3332768-2"></div> <script type="litespeed/javascript">window.yaContextCb.push(()=>{Ya.Context.AdvManager.render({"blockId":"R-A-3332768-2","renderTo":"yandex_rtb_R-A-3332768-2","type":"feed"})})</script></div><div class='code-block code-block-11' style='margin: 8px 0; clear: both;'><p>Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, <a href="https://t.me/+iju47uXqN9xlMTk6" target="_blank" rel="noopener">в нашем закрытом телеграмм канале - Подписывайтесь:)</a></p></div></div><footer class="entry-footer"></footer></div></article><div class="entry-related alignfull entry-related-style-wide"><div class="entry-related-inner content-container site-container"><div class="entry-related-inner-content alignwide"><h2 class="entry-related-title">Похожие записи</h2><div class="entry-related-carousel kadence-slide-init splide" data-columns-xxl="2" data-columns-xl="2" data-columns-md="2" data-columns-sm="2" data-columns-xs="2" data-columns-ss="1" data-slider-anim-speed="400" data-slider-scroll="1" data-slider-dots="true" data-slider-arrows="true" data-slider-hover-pause="false" data-slider-auto="false" data-slider-speed="7000" data-slider-gutter="40" data-slider-loop="true" data-slider-next-label="Далее" data-slider-slide-label="Записи" data-slider-prev-label="Назад"><div class="splide__track"><div class="splide__list grid-cols grid-sm-col-2 grid-lg-col-2"><div class="carousel-item splide__slide"><article class="entry content-bg loop-entry post-1661 post type-post status-publish format-standard has-post-thumbnail hentry category-ui-ux category-bez-rubriki"> <a class="post-thumbnail kadence-thumbnail-ratio-2-3" href="https://triu.ru/ux-design-10-sajtov-o-puteshestviyah-mogut-nauchit-vas/"><div class="post-thumbnail-inner"> <img data-lazyloaded="1" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3MDAiIGhlaWdodD0iNjc3IiB2aWV3Qm94PSIwIDAgNzAwIDY3NyI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2ZlZmVmZiIvPjwvc3ZnPg==" width="700" height="677" data-src="https://triu.ru/wp-content/uploads/2020/05/ux-vs-ui.jpg" class="attachment-medium_large size-medium_large wp-post-image" alt="UX Design: 10 сайтов о путешествиях могут научить вас" decoding="async" data-srcset="https://triu.ru/wp-content/uploads/2020/05/ux-vs-ui.jpg 700w, https://triu.ru/wp-content/uploads/2020/05/ux-vs-ui-300x290.jpg 300w" data-sizes="(max-width: 700px) 100vw, 700px" /></div> </a><div class="entry-content-wrap"><header class="entry-header"><h3 class="entry-title"><a href="https://triu.ru/ux-design-10-sajtov-o-puteshestviyah-mogut-nauchit-vas/" rel="bookmark">UX Design: 10 сайтов о путешествиях могут научить вас</a></h3></header><footer class="entry-footer"></footer></div></article></div><div class="carousel-item splide__slide"><article class="entry content-bg loop-entry post-2735 post type-post status-publish format-standard hentry category-web-design category-bez-rubriki"><div class="entry-content-wrap"><header class="entry-header"><h3 class="entry-title"><a href="https://triu.ru/kak-preobrazovat-css-v-sass-i-scss-dlya-veb-dizajnerov/" rel="bookmark">Как преобразовать CSS в Sass и SCSS для веб-дизайнеров</a></h3></header><footer class="entry-footer"></footer></div></article></div><div class="carousel-item splide__slide"><article class="entry content-bg loop-entry post-3988 post type-post status-publish format-standard has-post-thumbnail hentry category-mobile category-bez-rubriki"> <a class="post-thumbnail kadence-thumbnail-ratio-2-3" href="https://triu.ru/10-luchshih-shpionskih-prilozhenij-dlya-iphone/"><div class="post-thumbnail-inner"> <img data-lazyloaded="1" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3NjgiIGhlaWdodD0iNzY4IiB2aWV3Qm94PSIwIDAgNzY4IDc2OCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2ZlZmVmZiIvPjwvc3ZnPg==" width="768" height="768" data-src="https://triu.ru/wp-content/uploads/2021/05/mspy-768x768.jpg" class="attachment-medium_large size-medium_large wp-post-image" alt="10 лучших шпионских приложений для iPhone" decoding="async" data-srcset="https://triu.ru/wp-content/uploads/2021/05/mspy-768x768.jpg 768w, https://triu.ru/wp-content/uploads/2021/05/mspy-300x300.jpg 300w, https://triu.ru/wp-content/uploads/2021/05/mspy-1024x1024.jpg 1024w, https://triu.ru/wp-content/uploads/2021/05/mspy-150x150.jpg 150w, https://triu.ru/wp-content/uploads/2021/05/mspy-360x360.jpg 360w, https://triu.ru/wp-content/uploads/2021/05/mspy-545x545.jpg 545w, https://triu.ru/wp-content/uploads/2021/05/mspy.jpg 1200w" data-sizes="(max-width: 768px) 100vw, 768px" /></div> </a><div class="entry-content-wrap"><header class="entry-header"><h3 class="entry-title"><a href="https://triu.ru/10-luchshih-shpionskih-prilozhenij-dlya-iphone/" rel="bookmark">10 лучших шпионских приложений для iPhone</a></h3></header><footer class="entry-footer"></footer></div></article></div><div class="carousel-item splide__slide"><article class="entry content-bg loop-entry post-1175 post type-post status-publish format-standard has-post-thumbnail hentry category-toolkit category-bez-rubriki"> <a class="post-thumbnail kadence-thumbnail-ratio-2-3" href="https://triu.ru/cms-js-novejshij-besplatnyj-generator-sajtov-javascript/"><div class="post-thumbnail-inner"> <img data-lazyloaded="1" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3NjgiIGhlaWdodD0iNTg4IiB2aWV3Qm94PSIwIDAgNzY4IDU4OCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2ZlZmVmZiIvPjwvc3ZnPg==" width="768" height="588" data-src="https://triu.ru/wp-content/uploads/2020/05/01-cms-js-homepage-screenshot-768x588.jpg" class="attachment-medium_large size-medium_large wp-post-image" alt="CMS.js – новейший бесплатный генератор сайтов JavaScript" decoding="async" loading="lazy" data-srcset="https://triu.ru/wp-content/uploads/2020/05/01-cms-js-homepage-screenshot-768x588.jpg 768w, https://triu.ru/wp-content/uploads/2020/05/01-cms-js-homepage-screenshot-300x230.jpg 300w, https://triu.ru/wp-content/uploads/2020/05/01-cms-js-homepage-screenshot.jpg 1000w" data-sizes="(max-width: 768px) 100vw, 768px" /></div> </a><div class="entry-content-wrap"><header class="entry-header"><h3 class="entry-title"><a href="https://triu.ru/cms-js-novejshij-besplatnyj-generator-sajtov-javascript/" rel="bookmark">CMS.js – новейший бесплатный генератор сайтов JavaScript</a></h3></header><footer class="entry-footer"></footer></div></article></div><div class="carousel-item splide__slide"><article class="entry content-bg loop-entry post-2567 post type-post status-publish format-standard has-post-thumbnail hentry category-desktop category-bez-rubriki"> <a class="post-thumbnail kadence-thumbnail-ratio-2-3" href="https://triu.ru/kak-zapustit-neskolko-ekzemplyarov-google-diska-v-windows/"><div class="post-thumbnail-inner"> <img data-lazyloaded="1" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3NjgiIGhlaWdodD0iNDIyIiB2aWV3Qm94PSIwIDAgNzY4IDQyMiI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2ZlZmVmZiIvPjwvc3ZnPg==" width="768" height="422" data-src="https://triu.ru/wp-content/uploads/2020/08/add-new-user-768x422.jpg" class="attachment-medium_large size-medium_large wp-post-image" alt="Как запустить несколько экземпляров Google Диска в Windows" decoding="async" loading="lazy" data-srcset="https://triu.ru/wp-content/uploads/2020/08/add-new-user-768x422.jpg 768w, https://triu.ru/wp-content/uploads/2020/08/add-new-user-300x165.jpg 300w, https://triu.ru/wp-content/uploads/2020/08/add-new-user-360x198.jpg 360w, https://triu.ru/wp-content/uploads/2020/08/add-new-user-545x300.jpg 545w, https://triu.ru/wp-content/uploads/2020/08/add-new-user.jpg 800w" data-sizes="(max-width: 768px) 100vw, 768px" /></div> </a><div class="entry-content-wrap"><header class="entry-header"><h3 class="entry-title"><a href="https://triu.ru/kak-zapustit-neskolko-ekzemplyarov-google-diska-v-windows/" rel="bookmark">Как запустить несколько экземпляров Google Диска в Windows</a></h3></header><footer class="entry-footer"></footer></div></article></div><div class="carousel-item splide__slide"><article class="entry content-bg loop-entry post-2575 post type-post status-publish format-standard has-post-thumbnail hentry category-culture category-bez-rubriki"> <a class="post-thumbnail kadence-thumbnail-ratio-2-3" href="https://triu.ru/10-sajtov-dlya-poslednih-novostej-kibersporta-i-sovetov-po-professionalnym-igram/"><div class="post-thumbnail-inner"> <img data-lazyloaded="1" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3NjgiIGhlaWdodD0iNTMzIiB2aWV3Qm94PSIwIDAgNzY4IDUzMyI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2ZlZmVmZiIvPjwvc3ZnPg==" width="768" height="533" data-src="https://triu.ru/wp-content/uploads/2020/08/the-esports-observer-768x533.jpg" class="attachment-medium_large size-medium_large wp-post-image" alt="10 сайтов для последних новостей киберспорта и советов по профессиональным играм" decoding="async" loading="lazy" data-srcset="https://triu.ru/wp-content/uploads/2020/08/the-esports-observer-768x533.jpg 768w, https://triu.ru/wp-content/uploads/2020/08/the-esports-observer-300x208.jpg 300w, https://triu.ru/wp-content/uploads/2020/08/the-esports-observer-360x250.jpg 360w, https://triu.ru/wp-content/uploads/2020/08/the-esports-observer-545x378.jpg 545w, https://triu.ru/wp-content/uploads/2020/08/the-esports-observer.jpg 1000w" data-sizes="(max-width: 768px) 100vw, 768px" /></div> </a><div class="entry-content-wrap"><header class="entry-header"><h3 class="entry-title"><a href="https://triu.ru/10-sajtov-dlya-poslednih-novostej-kibersporta-i-sovetov-po-professionalnym-igram/" rel="bookmark">10 сайтов для последних новостей киберспорта и советов по профессиональным играм</a></h3></header><footer class="entry-footer"></footer></div></article></div></div></div></div></div></div></div><div id="comments" class="comments-area"><div id="respond" class="comment-respond"><h3 id="reply-title" class="comment-reply-title">Добавить комментарий <small><a rel="nofollow" id="cancel-comment-reply-link" href="/kak-sozdat-prilozhenie-dlya-chteniya-rss-na-javascript/#respond" style="display:none;">Отменить ответ</a></small></h3><form action="https://triu.ru/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate><p class="comment-notes"><span id="email-notes">Ваш адрес email не будет опубликован.</span> <span class="required-field-message">Обязательные поля помечены <span class="required">*</span></span></p><p class="comment-form-comment comment-form-float-label"><textarea id="comment" name="comment" placeholder="Оставить комментарий..." cols="45" rows="8" maxlength="65525" aria-required="true" required="required"></textarea><label class="float-label" for="comment">Комментарий <span class="required">*</span></label></p><div class="comment-input-wrap no-url-field"><p class="comment-form-author"><input aria-label="Имя" id="author" name="author" type="text" placeholder="John Doe" value="" size="30" maxlength="245" aria-required='true' required='required' /><label class="float-label" for="author">Имя <span class="required">*</span></label></p><p class="comment-form-email"><input aria-label="Email" id="email" name="email" type="email" placeholder="john@example.com" value="" size="30" maxlength="100" aria-describedby="email-notes" aria-required='true' required='required' /><label class="float-label" for="email">Email <span class="required">*</span></label></p></div><p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes" /> <label for="wp-comment-cookies-consent">Сохранить моё имя, email и адрес сайта в этом браузере для последующих моих комментариев.</label></p><p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Отправить комментарий" /> <input type='hidden' name='comment_post_ID' value='810' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /></p><p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="335fd082ab" /></p><p style="display: none !important;" class="akismet-fields-container" data-prefix="ak_"><label>Δ<textarea name="ak_hp_textarea" cols="45" rows="8" maxlength="100"></textarea></label><input type="hidden" id="ak_js_1" name="ak_js" value="171"/><script type="litespeed/javascript">document.getElementById("ak_js_1").setAttribute("value",(new Date()).getTime())</script></p></form></div></div></div></main><aside id="secondary" role="complementary" class="primary-sidebar widget-area sidebar-slug-sidebar-primary sidebar-link-style-normal"><div class="sidebar-inner-wrap"><section id="ai_widget-3" class="widget block-widget ai-sticky-widget"><div class='code-block code-block-6' style='margin: 8px 0; clear: both;'><div id="yandex_rtb_R-A-3332768-1"></div> <script type="litespeed/javascript">window.yaContextCb.push(()=>{Ya.Context.AdvManager.render({"blockId":"R-A-3332768-1","renderTo":"yandex_rtb_R-A-3332768-1"})})</script></div><div class="ai-sticky-space" style="height: 1500px;"></div></section></div></aside></div></div></div><footer id="colophon" class="site-footer" role="contentinfo"><div class="site-footer-wrap"><div class="site-bottom-footer-wrap site-footer-row-container site-footer-focus-item site-footer-row-layout-standard site-footer-row-tablet-layout-default site-footer-row-mobile-layout-default" data-section="kadence_customizer_footer_bottom"><div class="site-footer-row-container-inner"><div class="site-container"><div class="site-bottom-footer-inner-wrap site-footer-row site-footer-row-columns-1 site-footer-row-column-layout-row site-footer-row-tablet-column-layout-default site-footer-row-mobile-column-layout-row ft-ro-dir-row ft-ro-collapse-normal ft-ro-t-dir-default ft-ro-m-dir-default ft-ro-lstyle-plain"><div class="site-footer-bottom-section-1 site-footer-section footer-section-inner-items-2"><div class="footer-widget-area site-info site-footer-focus-item content-align-center content-tablet-align-default content-mobile-align-default content-valign-middle content-tablet-valign-default content-mobile-valign-default" data-section="kadence_customizer_footer_html"><div class="footer-widget-area-inner site-info-inner"><div class="footer-html inner-link-style-normal"><div class="footer-html-inner"><p>© 2024 Triu </p></div></div></div></div><div class="footer-widget-area widget-area site-footer-focus-item footer-navigation-wrap content-align-center content-tablet-align-default content-mobile-align-default content-valign-middle content-tablet-valign-default content-mobile-valign-default footer-navigation-layout-stretch-false" data-section="kadence_customizer_footer_navigation"><div class="footer-widget-area-inner footer-navigation-inner"><nav id="footer-navigation" class="footer-navigation" role="navigation" aria-label="Навигация в подвале"><div class="footer-menu-container"><ul id="footer-menu" class="menu"><li class="page_item page-item-4263"><a href="https://triu.ru/kontakty/">Контакты</a></li><li class="page_item page-item-4265"><a href="https://triu.ru/o-nas/">О нас</a></li><li class="page_item page-item-3"><a href="https://triu.ru/privacy-policy/">Политика конфиденциальности</a></li></ul></div></nav></div></div></div></div></div></div></div></div></footer></div><noscript><div> <img src="https://mc.yandex.ru/watch/62725144" style="position:absolute; left:-9999px;" alt=""/></div> </noscript> <script type="litespeed/javascript">document.documentElement.style.setProperty('--scrollbar-offset',window.innerWidth-document.documentElement.clientWidth+'px')</script> <a id="kt-scroll-up" tabindex="-1" aria-hidden="true" aria-label="Прокрутить вверх" href="#wrapper" class="kadence-scroll-to-top scroll-up-wrap scroll-ignore scroll-up-side-right scroll-up-style-outline vs-lg-true vs-md-true vs-sm-false"><span class="kadence-svg-iconset"><svg aria-hidden="true" class="kadence-svg-icon kadence-arrow-up-svg" fill="currentColor" version="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><title>Прокрутить вверх