Вы не можете так править потому что куском DOM владеет Vue и он его постоянно перерисовывает. Смотрите что происходит. Vue хранит виртуальный DOM и реактивные данные. Когда данные меняются, он собирает новый кусок реального DOM и заменяет старый. Любые правки которые вы сделали снаружи через jQuery или через querySelector, просто затираются при следующей перерисовке. Поэтому в консоли пусто, селектор в момент BX.ready еще ничего не находит. Проверить просто. Откройте Vue devtools, найдите этот блок kt-details__content. Если он внутри Vue компонента, значит он рендерится Vue. Откройте консоль и выполните ваш селектор вручную через пару секунд после загрузки страницы. Скорее всего он уже найдет элементы, а ваш код в BX.ready сработал раньше маунта. Самый правильный способ это менять не DOM, а данные Vue. Найдите компонент который рендерит таблицу и поменяйте его data или props. Тогда Vue сам перерисует как надо. Если надо именно снаружи и быстро починить, дождитесь когда Vue смонтировался и отрисовал. Внутри компонента это делается так
this.$nextTick(function() {
// тут DOM уже есть
})
Снаружи без доступа к компоненту используйте MutationObserver. Он сработает когда Vue вставит таблицу
Подводный камень. Даже если вы сейчас что то поменяете через jQuery, при любом обновлении данных Vue вернет все обратно. Поэтому смешивать jQuery и Vue на одном куске DOM это антипаттерн. Либо полностью перенесите логику в Vue, либо вынесите ваш блок за пределы Vue root.
Написано
Войдите на сайт
Чтобы задать вопрос и получить на него квалифицированный ответ.
this.$nextTick(function() {
// тут DOM уже есть
})
Снаружи без доступа к компоненту используйте MutationObserver. Он сработает когда Vue вставит таблицу
const target = document.querySelector('.kt-details__content')
const obs = new MutationObserver(() => {
const rows = target.querySelectorAll('table.kt-contact-table tr')
if(rows.length){
obs.disconnect()
// ваша логика тут
}
})
obs.observe(target, {childList: true, subtree: true})
Подводный камень. Даже если вы сейчас что то поменяете через jQuery, при любом обновлении данных Vue вернет все обратно. Поэтому смешивать jQuery и Vue на одном куске DOM это антипаттерн. Либо полностью перенесите логику в Vue, либо вынесите ваш блок за пределы Vue root.