Javascript адресной строке браузера

Объект Location в JavaScript — URL документа

Объект location — это один из дочерних объектов window , который отвечает за адресную строку окна или вкладки браузера. Доступ к данному объекту осуществляется как к свойству объекта window , т.е. через точку.

Объект location содержит свойства и методы, с помощью которых Вы можете не только получить текущий адрес страницы (URL или его части: имя хоста, номер порта, протокол и т.д.), но и изменить его.

Свойства объекта location

Свойства объекта location :

• hash — устанавливает или возвращает якорную часть (#) URL;
• host — устанавливает или возвращает имя хоста и номер порта URL;
• hostname — устанавливает или возвращает имя хоста URL;
• href — устанавливает или возвращает содержимое URL;
• origin — возвращает протокол, имя хоста и номер порта URL;
• pathname — устанавливает или возвращает часть URL, содержащей путь;
• port — устанавливает или возвращает номер порта URL;
• protocol — устанавливает или возвращает протокол URL;
• search — устанавливает или возвращает часть URL, содержащей строку с параметрами (?параметр1=значение1&параметр2=значение2&. );

В качестве примера рассмотрим следующую адресную строку (URL):

Примечание: Изменение URL или какой либо её части с помощью свойств объекта location приводит к немедленному переходу к этому URL в текущем окне, или в том окне или вкладке браузера, для которого этот объект был вызван.

Например, изменить href на http://itchief.ru для текущего окна:

window.location.href = "http://itchief.ru"; //для текущего окна "window." можно опустить location.href = "http://itchief.ru"; //кроме этого свойство href тоже можно опустить, т.к. location == location.href location = "http://itchief.ru";

Например, изменить href для окна с именем myWindow :

//откроем новое окно с помощью метода JavaScript open() var myWindow = window.open("","","height=300,width=400"); //изменим location окна, идентификатор которого хранится в myWindow myWindow.location.href = "http://itchief.ru";

Например, вывести на экран все свойства и методы объекта location и их значения для текущей веб-страницы.

Методы объекта location

• assign() — загружает новый документ в текущее окно (вкладку) браузера или в то окно для которого этот метод был вызван.
• reload() — перезагружает текущий документ. Метод reload() имеет один необязательный параметр булевского типа. Если в качестве параметра указать значение true , то страница будет принудительно обновлена с сервера. А если параметр не указывать или использовать в качестве параметра значение false , то браузер может обновить страницу, используя данные своего кэша. Метод reload() «имитирует» нажатие кнопки обновить в браузере.
• replace() — заменяет текущий документ с помощью нового документа, URL которого указан в качестве параметра.

Рассмотрим следующие примеры:

1. При нажатии на ссылку загрузим в 1 фрейм страницу http://nigma.ru/ :

  . Загрузить nigma во фрейм 

2. Откроем новое окно, в котором будем управлять адресной строкой с помощью методов объекта location :

• Создать окно «https://itchief.ru/»
• Загрузить «https://itchief.ru/javascript/»
• Заменим страницу на «https://itchief.ru/html-and-css/»

Источник

Почему в адресной строке браузера можно запустить javascript-код?

Потому что javascript выполняется на стороне клиента. А адресная строка браузера может быть использована как консоль.

Т.е. пишете http// сайт — он по http протоколу обращается к сайту. FTP://адрес — по ftp
Пишите javascript:команды — он их выполняет, как консоль джаваскрипта, который выполняется в браузере на стороне клиента.

Примерно так. Т.е. в адресной строке вы говорите браузеру что ему делать

А почему бы собственно и нет. К слову вроде как в последних версиях FF это вроде как уже нельзя делать или только собираются.

Сейчас эта практика считается дурным тоном, а масса лемингов таким образом раздает на право и на лево свои куки, потому что любят копировать и вставлять все что не поподя.

@lightGray вы ленитесь поискать в гугле и неверно формулируете вопрос. Протоколы используются не только в адресной строке.

@Petroveg Ну, типа, почему в адресной строке браузера можно запустить javascript-код? Почему вода мокрая? Зачем мы здесь?

@Petroveg вот вы чувствуете противоречие? Я не от лени неверно формулирую вопрос. А потому что у человека уйдет 3 минуты на лаконичный ответ на вопрос, а мне знаний не хватает даже на корректную формулировку.
Любезно предоставленную статью про букмаркеты уже добавил в новую вкладку. К вопросу о лени. Просто нужна была свежая мысль для новых поисков.
Вы как будто агрессивны.
А пара человек мне очень помогли. И вроде не много их времени я отнял.

@lightGray правильный и развёрнутый ответ вам дал @Fesor и рассказал про связь с неразвитой в те времена модели событий.
Я же написал фразу, в которой содержится весь практический смысл использования javascript:

Конечно, можно написать про URI, в котором используется так называемая схема и про упрощённую часть стандарта URL, в которой используется понятие протокол.
Можно рассказать, как браузер понимает, что делать, встретив ссылку с протоколом (то бишь схемой), привести примеры типа mailto: udp: и десятков других известных и не слишком схем.
Потом перейти к интерпретатору Javascript и оператору void (который многие до сих пор зачем-то используют для сравнения с undefined). Рассмотреть, зачем нужен возврат false в случае отказа от void и что произойдёт с документом при отсутствии и void, и возврата false.

Источник

Букмарклеты — JavaScript в адресной строке

Букмарклет (bookmarklet) — небольшая JavaScript-программа, сохраняемая как браузерная закладка.

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

Современные браузеры поддерживают несколько протоколов. Наиболее часто нами используется протокол http, для получения гипертекстовых документов. Реже используется ftp-протокол для обмена файлами, а вот о протоколе javascript слышали немногие. Адрес, записанный в протокоде javascript выглядит так:

javascript: /*здесь любой js-код в одну строку*/alert(‘I am bookmarklet!’);

В результате помещения этого адреса в адресную строку браузера выполнится следущий за javascript: js-код. В данном случае мы увидим окно-предупреждение с текстом ‘I am bookmarklet!’. Как и любой другой адрес, javascript-адреса можно размещать в обычных ссылках и добавлять в закладки.

Безопасность

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

Создание букмарклетов

У браузеров есть ограничение на длину букмарклетов, причем у каждого браузера оно свое. Экспериментальным путем автор выяснил, что самой жесткое ограничение у IE (Internet Explorer) — 500 символов. У остальных браузеров тоже есть лимит, но он больше и автор поленился его высчитывать .

Таким образом, при написании букмарклета лучше максимально сокращать имена переменных и функций. В идеале до одного символа.

Следующее ограничение диктуется форматом адреса — весь код должен быть написан в одну строку, иначе никак.

И последнее. Удобно записывать код в виде анонимной функции, вызываемой сразу после объявления, чтобы не получилось пересечения переменных букмарклета с переменными на странице.

Учитывая всё вышеперечисленное напишем простой букмарклет, который будет выводить адреса всех подключенных CSS-файлов на странице.

Код этого букмарклета, разнесенный на несколько строк для удобства чтения:

( function ( ) {
var d,b,c,cs,s,i;
d=document;
b=d. body ;
if ( !b ) return ;
s=document. getElementsByTagName ( ‘link’ ) ;
if ( !s. length ) return ;
c=d. createElement ( ‘span’ ) ;
cs=c. style ;
cs. position = ‘absolute’ ;
cs. top =cs. left = 0 ;
cs. background = ‘#EEE’ ;
for ( i= 0 ;i c. innerHTML += » +s [ i ] . href + ‘< \/ a>
‘ ;
b. appendChild ( c ) ;
window. scrollTo ( 0 , 0 ) ;
} ) ( ) ;

Можно выполнить сложные скрипты размером более 500 символов. В коде букмарклета вы можете подключить внешний js-файл с любого хоста, код которого сделает то, что вам нужно. К примеру, клик по этой ссылке подключит файл http://2007.fastcoder.ru/js/test.js, в котором алерт строки ‘test’.

( function ( ) {
var script=document. createElement ( ‘script’ ) ;
script. src = ‘http://2007.fastcoder.ru/js/test.js’ ;
document. body . appendChild ( script ) ;
} ) ( ) ;

Удачи в написании букмарклетов!

Источник

Вызов функции Javascript из URL / адресной строки

Можно ли вызвать функцию javascript из URL? Что-то вроде: http://www.example.com/mypage.aspx?javascript:printHelloWorld() Я знаю, если вы поместите javascript:alert(«Hello World»); в адресную строку, это сработает. Я подозреваю, что ответ на этот вопрос нет, просто подумал, есть ли способ сделать это.

Какое поведение будет отображать ваш URL — хотите ли вы запускать Javascript в контексте этого сайта?

http: в начале URI сообщает браузеру «Я хочу, чтобы вы сделали HTTP-запрос», поэтому HTTP-запрос это делает. Я думаю, что нет никакого пути.

Если я вставлю javascript:alert(«Hi»); в мою адресную строку Firefox (28.0) и нажмите Enter, ничего не происходит. Может быть, это было отключено? . Да, очевидно, это было отключено, потому что идиотов можно было убедить вставить что-нибудь в их адресную строку. Нашел информацию здесь: stackoverflow.com/a/18782801/111036

копировать вставить не работает, но если вы наберете его, он работает, похоже, что он не отключен, но анализируется при вставке.

Примечание: это работает только в Firefox, когда 1. вы находитесь на реальной (не пустой) странице и 2. вы явно ставите «javascript:» перед ним.

Хороший вопрос, хотя. 🙂 Я бы предположил, что это реагирует как вызов параметра и неверного символа, так как действие http http get учитывает все, что следует за ‘?’ параметр. Кроме того, это будет угрозой безопасности на стороне клиента.

7 ответов

Нет гиперссылки, нет. Если только страница не имеет script внутри специально для этого и проверяет какой-то параметр. но для вашего вопроса нет никакой встроенной поддержки в браузерах для этого.

Тем не менее bookmarklets вы можете добавлять закладки для быстрого запуска функций JavaScript из адресной строки; не уверен, что это соответствует вашим потребностям, но оно как можно ближе.

Убедитесь, что вы пишете в начале: javascript:

Источник

Location – URL текущей страницы

Объект Location связан с адресной строкой браузера, в его свойствах содержатся все компоненты URL доступные для чтения и записи.

Доступ к Location обычно осуществляется через объекты Document.location или Window.location . Если скрипт запускается из iframe (в одном домене), доступ к родительскому окну доступен через window.parent.location .

Рассмотрим какие будут значения при следующим URL:

Location.href

Вернет полный URL страницы.

console.log(window.location.href);

Результат:

http://www.example.com/pages/contats?page=1&sort=2#marker

Объекту location можно присвоить новый URL, браузер сразу перейдет на новую страницу.

window.location.href = 'https//snipp.ru';

Так же для редиректа можно использовать методы location.assign() и location.replace() . Отличие последнего в том, что пользователь не сможет использовать кнопку «назад».

window.location.assign('https//snipp.ru');

window.location.replace('https//snipp.ru');

Location.protocol

Возвращает используемый протокол, включая : .

console.log(window.location.protocol);

Результат:

Location.port

Номер порта, если его нет в URL, то ни чего не выведется.

console.log(window.location.port);

Location.host

Содержит домен и порт (если есть).

console.log(window.location.host);

Результат:

Источник