Получаем (например) <div id="delay_yandex_rtb_R-A-5433123-4">. И так со всеми баннерами.
Если хоть один баннер виден при открытии страницы, то код загружается сразу, иначе событие происходит после прокрутки на 300px страницы вниз.
document.addEventListener("DOMContentLoaded", function() {
'use strict';
let body = document.body,
html = document.documentElement,
wheight = Math.max(body.scrollHeight, body.offsetHeight,
html.clientHeight, html.scrollHeight, html.offsetHeight);
let adsYandex = document.querySelectorAll('div[id^="delay_yandex_rtb_R-A-"]'),
adInVisibleArea = false;
adsYandex.forEach(function(ad) {
let adRect = ad.getBoundingClientRect(),
adTop = Math.round(adRect.top);
if(adTop < wheight) adInVisibleArea = true;
});
function loadYaContext()
{
window.yaContextCb = window.yaContextCb || [];
let context = document.createElement("script");
context.src = "https://yandex.ru/ads/system/context.js";
document.head.addEventListener("load", function(event) {
if (event.target.nodeName === "SCRIPT")
{
adsYandex.forEach(function(ad) {
let blockID = ad.id.replace('delay_yandex_rtb_', '');
window.yaContextCb.push(() => {
// eslint-disable-next-line no-undef
Ya.Context.AdvManager.render({
renderTo: ad.id,
blockId: blockID
});
});
});
}
}, true);
document.head.appendChild(context);
}
function scrollCheck() {
if (scroll() > 300) {
loadYaContext();
window.removeEventListener("scroll", scrollCheck, false);
}
}
if(adInVisibleArea) {
loadYaContext();
} else {
window.addEventListener('scroll', scrollCheck, false);
}
});