Перейти по ссылке JavaScript примеры

Все способы перейти на другую страницу с помощью JavaScript. Есть множество способов, как сделать переход по ссылке с помощью JavaScript!

Все способы перехода по ссылке в JavaScript с примерами

1. Перейти по ссылке используя -> document.location.href
2. Перейти по ссылке используя -> document.location.replace
3. Перейти по ссылке используя -> javascript: document.location.href
4. Использование функции javascript для перехода по ссылке
5. Использование функции javascript для перехода по ссылке и onclick
6. Ссылка href без перехода по ссылке

Перейти по ссылке используя document.location.href

Для перехода на новую страницу будем использовать document.location.href

document.location.href = "https://dwweb.ru/";
Как теперь это можно использовать вместе с кликабельной ссылкой!?

Все просто! Добавляем например onclick(не забываем поменять двойные на одинарные и наоборот внутри, в зависимости от наружных) :

<a onclick="document.location.href = 'https://dwweb.ru/';">dwweb.ru</a>

Результат использования document.location.href в ссылке

Перейти по ссылке javascript



Перейти по ссылке используя document.location.replace

Если мы возьмем предыдущий вариант и заменяем href на replace, то такая ссылка тоже сработает:


<a onclick="document.location.replace('https://dwweb.ru/');" style="cursor:pointer;">Перейти по ссылке javascript </a>

Результат использования для перехода по ссылке document.location.replace

Перейти по ссылке javascript


Перейти по ссылке используя javascript: document.location.href

Ещё вариант прямо в атрибуте href записать javascript: document.location.href
<a href='javascript: document.location.href = "https://dwweb.ru/";'>Перейти</a>

Результат использования javascript: document.location.href в ссылке:

Перейти по ссылке javascript



Использование функции javascript для перехода по ссылке

Есть возможность использовать переход по ссылке с помощью функции javascript

Пишем вот такую функцию, внутрь помещаем ссылку:

<script>function goUrl() {document.location.href ="https://dwweb.ru/";}</script>

А уже где-то ниже помещаем тело самой ссылки

<a href="javascript: goUrl();">Перейти по ссылке javascript </a>

Результат:

Перейти по ссылке javascript


Использование функции javascript для перехода по ссылке и onclick

Тоже самое, что и выше идущий вариант, вместо javascript в ссылке ставим onclick

<script>function goUrl() {document.location.href ="https://dwweb.ru/";}</script>
<a onclick="goUrl()"; style="cursor:pointer;">Перейти по ссылке javascript </a>

Результат:

Перейти по ссылке javascript



Ссылка href без перехода по ссылке

Вообще... это поисковый запрос... script href без перехода - я немного не понимаю... если не требуется перехода по ссылке href - напрашивается вопрос - вам зачем вообще тогда содержимое в href , зачем вообще атрибут href , просто можно удалить href и повестить либо функцию на onclick, либо что-то прямо на тег :

<a onclick="alert('привет мир!')" style="cursor:pointer;">ссылка без href </a>

Результат:

ссылка без href
Предположим!!! Что есть какая-то ссылка с атрибутом href и каким то внутри содержимым, в смысле ссылкой! Но мы хотим, чтобы ссылка не срабатывала, т.е. пользователь не переходил по ссылке href, после выполнения функции onclick ставим return false; :

<a href="https://dwweb.ru/" onclick=" alert('привет мир!'); return false;">ссылка без перехода по href </a>

Результат ссылка с href безе перехода по url :

ссылка без перехода по href