Notice: Function _load_textdomain_just_in_time was called incorrectly. Translation loading for the hide-login-page domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. Please see Debugging in WordPress for more information. (This message was added in version 6.7.0.) in /home/artem952/domains/devarts.pro/public_html/wp-includes/functions.php on line 6114

Notice: Function _load_textdomain_just_in_time was called incorrectly. Translation loading for the wp-yandex-metrika domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. Please see Debugging in WordPress for more information. (This message was added in version 6.7.0.) in /home/artem952/domains/devarts.pro/public_html/wp-includes/functions.php on line 6114
JS - автоматизация сокрытия всех внешних ссылок на странице

JS – автоматизация сокрытия всех внешних ссылок на странице

hide external links - JS - автоматизация сокрытия всех внешних ссылок на странице

Задача: автоматически находить все ссылки на сайте при этом исключая внутренние и те, у которых имеется метка. Ко всем остальным добавлять префикс, который превращает их во внутренние ссылки. Перенаправлять таки ссылки на страницу- заглушку!

Продолжаю прокачивать свои скиллы в области JavaScript и наконец-то добрался до задачи, которая грызла меня очень давно. Буквально вчера решал такую же задачу по скрытию внешних ссылок на PHP, но там ссылки необходимо скрывать вручную.

Скрипт полностью реализован на нативном JavaScript, что исключает необходимость использовать сторонние библиотеки, такие, как jQuery.

Скрипт поиска внешних ссылок

Создаем файл в формате *.js, например, стандартное script.js и подключаем его в самом низу страницы перед закрывающим тегом BODY следующей строкой.

<script src="script.js"></script>
window.onload = function(){

	var all_links = document.querySelectorAll('a[href]');

	// Получаем домен текущего сайта
	var c_prot = window.location.protocol,
	//класс метка, для ислючения подмены
		classname = 'in';

	for(let i = 0; i < all_links.length; i++){

		// Первые четыре символа в ссылке 
		var str = all_links[i].getAttribute('href').substring(0,4);

		// получаем домен внешнего урл
		var l_prot = all_links[i].origin;

		// Сразу отсеиваем ссылки без HTTP — внутренние ссылки href="/news"
		if(str == 'http'){
			// Сверяем домен ссылки с доменом сайта и наличие метки
			if(all_links[i].href != c_prot && !all_links[i].classList.contains(classname)){

				// Добавляем в ссылку префикс
				 all_links[i].href = '/go.php?go=' + all_links[i].href;
			}
		}
		
	}
}

В виде картинки

hide external links script - JS - автоматизация сокрытия всех внешних ссылок на странице

Для того, чтобы ссылка не шифровалась, ей в код необходимо добавить класс “in”. Данный класс вынесен в отдельную переменную и при необходимости его можно заменить на любой другой.

Логика

В комментариях, в принципе, все подробно расписано, но логику все же опишу.

  • Мы получаем все ссылки на странице у которых имеется атрибут href и формируем из них массив;
  • Создаем переменные с именем класса и нашим локальным доменом;
  • Далее пробегаем по данному массиву при помощи обычного цикла for и проверяем в ссылках наличие http, что уже говорит о том, что ссылка внешняя или же записана с ненужным указанием локального домена;
  • Проверяем, что домен ссылки не является доменом сайта и у данной ссылки отсутствует класс-метка для запрета шифрования;
  • Если все условия выполнились исправляем ссылку, добавляя ей префикс;

Страница заглушка для внешних ссылок

Данная страница уже описана в другой статье здесь.

Для не знающих: просьба не пугаться т.к. в той статье вместо go используется r и это не имеет никакого значения. Выберите то слово, которое вам больше нравится (r гораздо короче), например:

go.php?r=
go.php?go=
r.php?go=
r.php?r=
blabalbla.php?rerere=

Соответственно, принимаем мы не название файла, а ключ массива, идущий после знака вопроса — $_GET[‘rerere’]

Похожие записи


JS — скрыть внешние ссылки на сайте
Очень простой скрипт для скрытия внешних ссылок на любом сайте. Разрабатывался для CMS WordPress, но будет работать абсолютно везде. Полностью...
jQuery — таймер обратного отсчета с изменяемой скоростью
Рассмотрим наглядный пример управления таймером на jQuery. Задача: Таймер запускается при загрузке страницы. При клике на кнопку с числом скорость...
jQuery Cookies — ограничиваем повтор события с помощью куков
Cookies — возможность сохранить в браузере некие данные, которые не удалятся после обновления страницы. Задача: отследить с помощью javaScript фиксированное...
jQuery — очищаем поле с результатом после каждого выполненного события
Уже после написаний данной статьи случайно наткнулся на реальный пример описанного здесь простейшего косяка в jQuery коде. Это известный онлайн...
jQuery — простое модальное окно
В данной статье расскажу про очень простое решение с модальным окном на jQuery. Прикручивал его поверх платного конструктора шаблонов сайта...

Комментарии

  1. @Alex пишет:

    proverka

    • @devarts пишет:

      Проверка чего?

Добавить комментарий