https://8j0rn.dagbok.ru/history/Wp:JavaScript?feed=atom
Wp:JavaScript - История изменений
2026-10-26T19:43:36Z
История изменений этой страницы в вики
MediaWiki 1.41.0
https://8j0rn.dagbok.ru/index.php?title=Wp:JavaScript&diff=300&oldid=prev
8j0rn в 21:20, 21 марта 2025
2025-03-21T21:20:06Z
<p></p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="ru">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Предыдущая версия</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Версия от 00:20, 22 марта 2025</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l80">Строка 80:</td>
<td colspan="2" class="diff-lineno">Строка 80:</td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>function openMap(address, event) {</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>function openMap(address, event) {</div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> const isMobile = /Android|webOS|iPhone|iPad|iPadOS|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> const isMobile = /Android|webOS|iPhone|iPad|iPadOS|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);</div></td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div> const isIOS = /iPhone|iPad|iPod/i.test(navigator.userAgent);</div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> const isIOS = /iPhone|iPad|iPod<ins style="font-weight: bold; text-decoration: none;">|iPadOS</ins>/i.test(navigator.userAgent);</div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><br></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><br></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> const yandexMapsUrl = `https://yandex.ru/maps/?text=${address}`;</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> const yandexMapsUrl = `https://yandex.ru/maps/?text=${address}`;</div></td></tr>
<tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l230">Строка 230:</td>
<td colspan="2" class="diff-lineno">Строка 230:</td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> function openMap(address, event) {</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> function openMap(address, event) {</div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> const isMobile = /Android|webOS|iPhone|iPad|iPadOS|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> const isMobile = /Android|webOS|iPhone|iPad|iPadOS|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);</div></td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div> const isIOS = /iPhone|iPad|iPod/i.test(navigator.userAgent);</div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> const isIOS = /iPhone|iPad|iPod<ins style="font-weight: bold; text-decoration: none;">|iPadOS</ins>/i.test(navigator.userAgent);</div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><br></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><br></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> const yandexMapsUrl = `https://yandex.ru/maps/?text=${address}`;</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> const yandexMapsUrl = `https://yandex.ru/maps/?text=${address}`;</div></td></tr>
</table>
8j0rn
https://8j0rn.dagbok.ru/index.php?title=Wp:JavaScript&diff=299&oldid=prev
8j0rn: Новая страница: «Разные интересности добавленные в качестве JS: ==1.1. Обертыши для адресов, телефонов и E-Mail через ID== Почему-то не всегда на все срабатывает. Но думаю найду причину. Пример HTML вставки: <syntaxhighlight lang="html"> <address id="mail">mail@mail.ru</adress> <address id="tel_num">+7 (999) 888-77-66</address> <address id="a...»
2025-03-21T21:17:56Z
<p>Новая страница: «Разные интересности добавленные в качестве JS: ==1.1. Обертыши для адресов, телефонов и E-Mail через ID== Почему-то не всегда на все срабатывает. Но думаю найду причину. Пример HTML вставки: <syntaxhighlight lang="html"> <address id="mail">mail@mail.ru</adress> <address id="tel_num">+7 (999) 888-77-66</address> <address id="a...»</p>
<p><b>Новая страница</b></p><div>Разные интересности добавленные в качестве JS:<br />
==1.1. Обертыши для адресов, телефонов и E-Mail через ID==<br />
Почему-то не всегда на все срабатывает. Но думаю найду причину.<br />
Пример HTML вставки:<br />
<syntaxhighlight lang="html"><br />
<address id="mail">mail@mail.ru</adress><br />
<address id="tel_num">+7 (999) 888-77-66</address><br />
<address id="adress_lnk">191186, Санкт-Петербург, Невский пр., д. 77/33</address><br />
</syntaxhighlight><br />
<br />
Сам собственно код JS:<br />
<syntaxhighlight lang="js"><br />
function handleAddressElements() {<br />
// Обрабатываем <address id="adress_lnk"><br />
const addressLink = document.getElementById('adress_lnk');<br />
if (addressLink && !addressLink.dataset.processed) {<br />
addressLink.dataset.processed = true;<br />
const text = encodeURIComponent(addressLink.textContent.trim());<br />
if (!text) {<br />
console.error('Адрес пустой');<br />
return;<br />
}<br />
const link = document.createElement('a');<br />
link.href = '#';<br />
link.textContent = addressLink.textContent;<br />
link.addEventListener('click', function (event) {<br />
openMap(text, event);<br />
});<br />
addressLink.innerHTML = '';<br />
addressLink.appendChild(link);<br />
}<br />
<br />
// Обрабатываем <address id="tel_num"><br />
const telNum = document.getElementById('tel_num');<br />
if (telNum && !telNum.dataset.processed) {<br />
telNum.dataset.processed = true;<br />
const phoneNumber = telNum.textContent.trim();<br />
if (!phoneNumber) {<br />
console.error('Номер телефона пустой');<br />
return;<br />
}<br />
telNum.style.cursor = 'pointer';<br />
telNum.addEventListener('click', function () {<br />
openPhoneModal(phoneNumber);<br />
});<br />
}<br />
<br />
// Обрабатываем <address id="mail"><br />
const mailAddress = document.getElementById('mail');<br />
if (mailAddress && !mailAddress.dataset.processed) {<br />
mailAddress.dataset.processed = true;<br />
const email = mailAddress.textContent.trim();<br />
if (!email) {<br />
console.error('Email пустой');<br />
return;<br />
}<br />
const mailtoLink = document.createElement('a');<br />
mailtoLink.href = `mailto:${email}`;<br />
mailtoLink.textContent = email;<br />
mailAddress.innerHTML = '';<br />
mailAddress.appendChild(mailtoLink);<br />
}<br />
}<br />
<br />
// Обрабатываем элементы при загрузке страницы<br />
document.addEventListener('DOMContentLoaded', handleAddressElements);<br />
<br />
// Отслеживаем добавление новых элементов<br />
const observer = new MutationObserver(function (mutations) {<br />
mutations.forEach(function (mutation) {<br />
if (mutation.type === 'childList') {<br />
handleAddressElements();<br />
}<br />
});<br />
});<br />
<br />
observer.observe(document.body, { childList: true, subtree: true });<br />
<br />
// Функция для открытия карты<br />
function openMap(address, event) {<br />
const isMobile = /Android|webOS|iPhone|iPad|iPadOS|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);<br />
const isIOS = /iPhone|iPad|iPod/i.test(navigator.userAgent);<br />
<br />
const yandexMapsUrl = `https://yandex.ru/maps/?text=${address}`;<br />
const googleMapsUrl = `https://www.google.com/maps/search/?api=1&query=${address}`;<br />
const appleMapsUrl = `http://maps.apple.com/?q=${address}`;<br />
const dgisUrl = `https://2gis.ru/search/${address}`;<br />
<br />
if (isMobile) {<br />
const yandexWindow = window.open(yandexMapsUrl, '_blank');<br />
setTimeout(() => {<br />
if (!yandexWindow || yandexWindow.closed || yandexWindow.innerHeight === 0) {<br />
if (isIOS) {<br />
window.open(appleMapsUrl, '_blank');<br />
} else {<br />
window.open(googleMapsUrl, '_blank');<br />
}<br />
}<br />
}, 500);<br />
} else {<br />
window.open(dgisUrl, '_blank');<br />
}<br />
<br />
event.preventDefault();<br />
}<br />
<br />
// Функция для открытия модального окна с выбором действия для телефона<br />
function openPhoneModal(phoneNumber) {<br />
const cleanedCallNumber = phoneNumber.replace(/[\s\-()]/g, '');<br />
const cleanedWhatsappNumber = phoneNumber.replace(/[\s\-()+]/g, '');<br />
<br />
const modal = document.createElement('div');<br />
modal.style.position = 'fixed';<br />
modal.style.top = '0';<br />
modal.style.left = '0';<br />
modal.style.width = '100%';<br />
modal.style.height = '100%';<br />
modal.style.backgroundColor = 'rgba(0, 0, 0, 0.8)';<br />
modal.style.zIndex = '1000';<br />
modal.style.display = 'flex';<br />
modal.style.justifyContent = 'center';<br />
modal.style.alignItems = 'center';<br />
<br />
const buttonContainer = document.createElement('div');<br />
buttonContainer.style.backgroundColor = 'rgba(255, 255, 255, 0.33)';<br />
buttonContainer.style.padding = '150px 50px';<br />
buttonContainer.style.borderRadius = '50px';<br />
buttonContainer.style.border = '2px solid #ccc';<br />
buttonContainer.style.textAlign = 'center';<br />
buttonContainer.style.boxShadow = '3px 3px 5px 0 rgba(0, 0, 0, 0.5)';<br />
<br />
const callButton = document.createElement('button');<br />
callButton.textContent = 'Позвонить';<br />
callButton.style.margin = '10px';<br />
callButton.style.padding = '10px 20px';<br />
callButton.style.backgroundColor = '#007BFF';<br />
callButton.style.color = '#fff';<br />
callButton.style.border = '3px solid rgb(0, 64, 128)';<br />
callButton.style.borderRadius = '10px';<br />
callButton.style.boxShadow = '3px 3px 5px 0 rgba(0, 0, 0, 0.5)';<br />
callButton.style.cursor = 'pointer';<br />
callButton.addEventListener('click', function () {<br />
window.open(`tel:${cleanedCallNumber}`, '_blank');<br />
document.body.removeChild(modal);<br />
});<br />
<br />
const whatsappButton = document.createElement('button');<br />
whatsappButton.textContent = 'Написать в WhatsApp';<br />
whatsappButton.style.margin = '10px';<br />
whatsappButton.style.padding = '10px 20px';<br />
whatsappButton.style.backgroundColor = 'rgb(37,211,102)';<br />
whatsappButton.style.color = '#fff';<br />
whatsappButton.style.border = '3px solid rgb(16, 105, 51)';<br />
whatsappButton.style.borderRadius = '10px';<br />
whatsappButton.style.boxShadow = '3px 3px 5px 0 rgba(0, 0, 0, 0.5)';<br />
whatsappButton.style.cursor = 'pointer';<br />
whatsappButton.addEventListener('click', function () {<br />
window.open(`https://wa.me/${cleanedWhatsappNumber}`, '_blank');<br />
document.body.removeChild(modal);<br />
});<br />
<br />
const closeButton = document.createElement('button');<br />
closeButton.textContent = 'Закрыть';<br />
closeButton.style.margin = '10px';<br />
closeButton.style.padding = '10px 20px';<br />
closeButton.style.backgroundColor = 'rgb(220,53,69)';<br />
closeButton.style.color = '#fff';<br />
closeButton.style.border = '3px solid rgb(110, 26, 34)';<br />
closeButton.style.borderRadius = '10px';<br />
closeButton.style.boxShadow = '3px 3px 5px 0 rgba(0, 0, 0, 0.5)';<br />
closeButton.style.cursor = 'pointer';<br />
closeButton.addEventListener('click', function () {<br />
document.body.removeChild(modal);<br />
});<br />
<br />
buttonContainer.appendChild(callButton);<br />
buttonContainer.appendChild(whatsappButton);<br />
buttonContainer.appendChild(closeButton);<br />
<br />
modal.appendChild(buttonContainer);<br />
<br />
document.body.appendChild(modal);<br />
}<br />
</syntaxhighlight><br />
<br />
==1.2. Те же обертыши для адресов, телефонов и E-Mail, но уже через CLASS==<br />
<br />
<syntaxhighlight lang="js"><br />
document.addEventListener('DOMContentLoaded', function () {<br />
// Обрабатываем <address class="adress_lnk"><br />
const addressLinks = document.querySelectorAll('.adress_lnk');<br />
addressLinks.forEach(function (addressLink) {<br />
const text = encodeURIComponent(addressLink.textContent.trim());<br />
const link = document.createElement('a');<br />
link.href = '#';<br />
link.textContent = addressLink.textContent;<br />
link.addEventListener('click', function (event) {<br />
openMap(text, event);<br />
});<br />
addressLink.innerHTML = '';<br />
addressLink.appendChild(link);<br />
});<br />
<br />
// Обрабатываем <address class="tel_num"><br />
const telNums = document.querySelectorAll('.tel_num');<br />
telNums.forEach(function (telNum) {<br />
const phoneNumber = telNum.textContent.trim();<br />
telNum.style.cursor = 'pointer';<br />
telNum.addEventListener('click', function () {<br />
openPhoneModal(phoneNumber);<br />
});<br />
});<br />
<br />
// Обрабатываем <address class="mail"><br />
const mailElements = document.querySelectorAll('.mail');<br />
mailElements.forEach(function (mailAddress) {<br />
const email = mailAddress.textContent.trim();<br />
if (!email) {<br />
console.error('Email пустой');<br />
return;<br />
}<br />
const mailtoLink = document.createElement('a');<br />
mailtoLink.href = `mailto:${email}`;<br />
mailtoLink.textContent = email;<br />
mailAddress.innerHTML = '';<br />
mailAddress.appendChild(mailtoLink);<br />
});<br />
<br />
// Функция для открытия карты<br />
function openMap(address, event) {<br />
const isMobile = /Android|webOS|iPhone|iPad|iPadOS|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);<br />
const isIOS = /iPhone|iPad|iPod/i.test(navigator.userAgent);<br />
<br />
const yandexMapsUrl = `https://yandex.ru/maps/?text=${address}`;<br />
const googleMapsUrl = `https://www.google.com/maps/search/?api=1&query=${address}`;<br />
const appleMapsUrl = `http://maps.apple.com/?q=${address}`;<br />
const dgisUrl = `https://2gis.ru/search/${address}`;<br />
<br />
if (isMobile) {<br />
const yandexWindow = window.open(yandexMapsUrl, '_blank');<br />
setTimeout(() => {<br />
if (!yandexWindow || yandexWindow.closed || yandexWindow.innerHeight === 0) {<br />
if (isIOS) {<br />
window.open(appleMapsUrl, '_blank');<br />
} else {<br />
window.open(googleMapsUrl, '_blank');<br />
}<br />
}<br />
}, 500);<br />
} else {<br />
window.open(dgisUrl, '_blank');<br />
}<br />
<br />
event.preventDefault();<br />
}<br />
<br />
// Функция для открытия модального окна с выбором действия для телефона<br />
function openPhoneModal(phoneNumber) {<br />
const cleanedCallNumber = phoneNumber.replace(/[\s\-()]/g, '');<br />
const cleanedWhatsappNumber = phoneNumber.replace(/[\s\-()+]/g, '');<br />
<br />
const modal = document.createElement('div');<br />
modal.style.position = 'fixed';<br />
modal.style.top = '0';<br />
modal.style.left = '0';<br />
modal.style.width = '100%';<br />
modal.style.height = '100%';<br />
modal.style.backgroundColor = 'rgba(0, 0, 0, 0.8)';<br />
modal.style.zIndex = '1000';<br />
modal.style.display = 'flex';<br />
modal.style.justifyContent = 'center';<br />
modal.style.alignItems = 'center';<br />
<br />
const buttonContainer = document.createElement('div');<br />
buttonContainer.style.backgroundColor = 'rgba(255, 255, 255, 0.33)';<br />
buttonContainer.style.padding = '150px 50px';<br />
buttonContainer.style.borderRadius = '50px';<br />
buttonContainer.style.border = '2px solid #ccc';<br />
buttonContainer.style.textAlign = 'center';<br />
buttonContainer.style.boxShadow = '3px 3px 5px 0 rgba(0, 0, 0, 0.5)';<br />
<br />
const callButton = document.createElement('button');<br />
callButton.textContent = 'Позвонить';<br />
callButton.style.margin = '10px';<br />
callButton.style.padding = '10px 20px';<br />
callButton.style.backgroundColor = '#007BFF';<br />
callButton.style.color = '#fff';<br />
callButton.style.border = '3px solid rgb(0, 64, 128)';<br />
callButton.style.borderRadius = '10px';<br />
callButton.style.boxShadow = '3px 3px 5px 0 rgba(0, 0, 0, 0.5)';<br />
callButton.style.cursor = 'pointer';<br />
callButton.addEventListener('click', function () {<br />
window.open(`tel:${cleanedCallNumber}`, '_blank');<br />
document.body.removeChild(modal);<br />
});<br />
<br />
const whatsappButton = document.createElement('button');<br />
whatsappButton.textContent = 'Написать в WhatsApp';<br />
whatsappButton.style.margin = '10px';<br />
whatsappButton.style.padding = '10px 20px';<br />
whatsappButton.style.backgroundColor = 'rgb(37,211,102)';<br />
whatsappButton.style.color = '#fff';<br />
whatsappButton.style.border = '3px solid rgb(16, 105, 51)';<br />
whatsappButton.style.borderRadius = '10px';<br />
whatsappButton.style.boxShadow = '3px 3px 5px 0 rgba(0, 0, 0, 0.5)';<br />
whatsappButton.style.cursor = 'pointer';<br />
whatsappButton.addEventListener('click', function () {<br />
window.open(`https://wa.me/${cleanedWhatsappNumber}`, '_blank');<br />
document.body.removeChild(modal);<br />
});<br />
<br />
const closeButton = document.createElement('button');<br />
closeButton.textContent = 'Закрыть';<br />
closeButton.style.margin = '10px';<br />
closeButton.style.padding = '10px 20px';<br />
closeButton.style.backgroundColor = 'rgb(220,53,69)';<br />
closeButton.style.color = '#fff';<br />
closeButton.style.border = '3px solid rgb(110, 26, 34)';<br />
closeButton.style.borderRadius = '10px';<br />
closeButton.style.boxShadow = '3px 3px 5px 0 rgba(0, 0, 0, 0.5)';<br />
closeButton.style.cursor = 'pointer';<br />
closeButton.addEventListener('click', function () {<br />
document.body.removeChild(modal);<br />
});<br />
<br />
buttonContainer.appendChild(callButton);<br />
buttonContainer.appendChild(whatsappButton);<br />
buttonContainer.appendChild(closeButton);<br />
<br />
modal.appendChild(buttonContainer);<br />
<br />
document.body.appendChild(modal);<br />
}<br />
});<br />
</syntaxhighlight></div>
8j0rn