Как получить параметр из URL страницы

Как получить нужный параметр из адреса страницы?

Итак, у нас есть рекламная кампания, и при переходе по ссылкам из этой кампании, мы получим url типа такого:

https://site.com/?utm_source=facebook

Но источник перехода на сайт может быть разный, и нам нужно отследить параметр utm_source и передать его на обработку дальше.

Вариант 1 — Присваиваем переменной source значение параметра utm_source:

var source = location.search.split('utm_source=').splice(1).join('').split('&')[0];

Если параметров будет больше, то нужно будет копипастить код с изменениями, не очень универсальное решение.

Вариант 2 — создаем функцию, которая будет получать значение любого, указанного параметра:

function getURLParameter(name) {
  return decodeURIComponent((RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1] || '');
}

И потом получаем значение параметра utm_source:

var source = getURLParameter('utm_source');

А если нужно получить несколько разных параметров, то с этой же функцией сделать это гораздо проще.

Например есть такой url

https://site.com/?utm_source=facebook&utm_medium=ppc

Получаем параметры:

var source = getURLParameter('utm_source'); //facebook
var medium = getURLParameter('utm_medium'); //ppc
Плавный скроллинг по странице к нужному элементу с использованием плагина PageScroll2id

В предыдущей статье Плавный скролл по странице к нужному ID (Scroll to id) рассматривал простой…

Как задать тексту фоновый рисунок с помощью CSS-свойства background-clip

Простой пример, как можно задать для текста фоновое изображение с помощью CSS-свойства background-clip. HTML —…

Используем медиа-запросы вместе с LESS

Стандартное использование медиа-запросов в CSS: // Area site .area { margin-left: auto; margin-right: auto; }…

Использование CSS-функции calc() в LESS

В CSS есть функция calc(), которая даёт возможность рассчитать значения свойств CSS во время их…

Ответить