// При клике на кнокпу выполняем функцию:
$('#employee_avatar_button').click(function(){
// Создаем наблюдателя, переданная функция будет
// выполнятся всякий раз при изменении страницы:
var observer = new MutationObserver(function() {
// Ищем нужный нам элемент:
var el = $('#employee_avatar_ul li::last-child');
// Если элемент найден:
if (el.length > 0) {
// Откл. наблюдателя:
observer.disconnect();
// Выводим уведомления:
console.log('Найден элемент:');
console.dir(el[0]);
console.log('Его атрибут file_id: ' + el.attr('file_id'));
}
// Если элемента еще нет:
else {
// Выводим соотвествующее уведомление:
console.log('Обнаружено изменение содержимого тега <body></body> - однако элемент, который мы ждем, пока еще отсуствует на странице.');
}
});
// Прикрепляем наблюдатель к body:
observer.observe(document.body, {
characterData: true,
attributes: true,
childList: true,
subtree: true
});
});
<script>
// Ждем готовности документа и запускаем функцию titleRename:
document.addEventListener('DOMContentLoaded', titleRename);
// Функция для изменения титула страницы:
function titleRename() {
// Ищем элемент h1 и записываем ссылку на него в переменную h1_element:
var h1_element = document.querySelector('h1');
// Если в переменной h1_element что-нибудь есть:
if (h1_element) {
// Читаем из h1_element только текст и записываем в переменную h1_text:
var h1_text = h1_element.innerText;
// Ищем элемент title и внуть него записываем текст из переменной h1_text:
document.querySelector('title').innerHTML = h1_text;
}
}
</script>
async function getScript() {
try {
var response = await (await fetch('/index.php?route=product/compare/add', { method: 'POST', body: data })).json();
var doc = new DOMParser().parseFromString(reponse.tpl, 'text/html');
var code = doc.querySelector('script').innerHTML; eval(code);
console.log("Следующий скрипт успешно выполнен:\n" + code);
} catch(err) {
alert('При загрузке скрипта произошла ошибка, детали см. в консоли.');
console.log('При загрузке скрипта произошла ошибка:');
console.error(err);
}
}
getScript();
async function pageUpdate(event) {
// Если функция вызвана без аргументов:
if (typeof event == 'undefined') {
// Устанавливаем обработчики
// на все ссылки на странице:
$('a[href]').click(pageUpdate);
}
// Если функция вызвана
// в результате клика
// по ссылке:
else {
// Берём адрес с нажатой ссылки
// и записываем в переменную link:
var link = event.target.href;
// Если ссылка ведет на наш сайт:
if (link.includes(location.host)) {
// Предотвращаем переход:
event.preventDefault();
// Блокируем страницу, чтобы
// больше нельзя было кликать:
$('body').css('pointer-events', 'none');
// Активируем анимацию
// постепенного исчезновения
await $('body').animate({ opacity: 0 }, 1000).promise();
// Грузим новую страницу AJAX-ом без
// фактической перезагрузки текущей:
var html = await $.ajax(link);
var doc = new DOMParser().parseFromString(html, 'text/html');
var html = $('body', doc).html();
history.pushState(null, null, link);
$('body').html(html);
// Заново ставим
// обработчики:
pageUpdate();
// Активируем анимацию
// постепенного появления:
await $('body').animate({ opacity: 1 }, 1000).promise();
// Снимаем блокировку с документа:
$('body').css('pointer-events', '');
}
}
}
pageUpdate();
$('.post-like').click(async function(){
var response = await $.ajax({
url: '/ajax/post_like.php',
type: 'POST',
dataType: 'json',
data: {
action: 'check',
post_id: $(this).parents('.item').attr('id')
}
});
if (response.already_vote == 1) {
alert('Еденица!');
} else {
alert('Не еденица!');
}
});
JAMstack — подход для создания статических сайтов. Он включает в себя JavaScript, API и разметку. При использовании такого подхода, разработчики используют JavaScript для взаимодействия пользователя с контентом, API в качестве источника информации.... Метод отличается от традиционного применения CMS отсутствием необходимости задействовать веб-сервер для фронтенда.
// Функция для преобразования объекта
// в строку формата x-www-form-urlencoded:
function httpBuildQuery(object_to_convert) {
var params = new URLSearchParams();
var paramsGenerator = function(parent_key, iterate_object) {
for (var current_key in iterate_object) {
if (typeof iterate_object[current_key] == 'string' || typeof iterate_object[current_key] == 'number') {
if (parent_key.length > 0) {
var property_path = parent_key + '[' + current_key + ']';
} else {
var property_path = current_key;
}
params.append(property_path, iterate_object[current_key]);
} else if (typeof iterate_object[current_key] == 'object') {
if (parent_key.length > 0) {
var property_path = parent_key + '[' + current_key + ']';
} else {
var property_path = current_key;
}
paramsGenerator(property_path, iterate_object[current_key]);
}
}
}
paramsGenerator('', object_to_convert);
return params.toString();
}
// Протестируем работу функции на примере:
var test_object = {
'raz' : 'Первое свойство',
'dva' : 'Второе свойство',
'tri' : {
'test' : 'Тест',
'proverka' : 'Проверка',
'massiv' : [
'aaa',
'bbb',
'ccc',
{
'lalala' : 'lololo',
'tratata' : 'trototo'
},
123,
345,
567
]
}
};
var send_string = httpBuildQuery(test_object);
var response = await (await fetch('/NewAdvert', {
method: 'POST',
headers: {
'Content-Type' : 'application/x-www-form-urlencoded'
},
body: send_string
})).text();
console.log(response);
chrome.extension.sendMessage('Ваше сообщение');
chrome.extension.onMessage.addListener(function(message) {
console.log('Принято сообщение: ' + message);
});