Что такое скрипты на сайте

Что такое скрипты и как ими пользоваться

В этой статье мы рассмотрим такое понятие как скрипт. Что такое скрипты, как ими пользоваться, где применять и, конечно, примеры скриптов javascript для сайта.

Что такое скрипты?

Общее понятие таково: скриптом называется программа или программный файл-сценарий. Ну, а если сказать проще, то скриптом будет называться практически любая исполняемая процедура.

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

Можно добавить, что скрипты не являются частью html, так как это совсем другие технологии, которые мы привязываем к нашему документу при помощи специальных тэгов или (и) их атрибутов.

Бывают скрипты простыми в исполнении, как например «выпадающее меню» или кнопка «назад-вперёд» или «вверх» и сложными, как например «счётчик», «гостевая книга» и другие варианты их использования.

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

Ну да ладно, это всё присказка, нас ждет сказка )

Javascript для сайта — примеры скриптов javascript

Открытие нового окна javascript

Самый простой и часто применяемый скрипт

URL — URL откpываемого pесypса. Может быть ссылкой на любой понимаемый Обозревателем докyмент (в том числе и на локальной машине).

Parameter — паpаметpы нового окна (в виде текстовой стpоки). Записываются без пробелов чеpез запятyю:

Toolbar=[yes|no|1|0] — Присутствие Панели инструментов
Location=[yes|no|1|0] — Присутствие адреса
Directories=[yes|no|1|0] — Присутствие ссылок
Status=[yes|no|1|0] — Присутствие статустной строки
Menubar=[yes|no|1|0] — Присутствие меню
Scrollbars=[yes|no|1|0] — Присутсвие прокрутки
Resizable=[yes|no|1|0] — Изменение размера окна мышью
Width=[pазмеp в пикселях] — Высота окна
Height=[pазмеp в пикселях] — Ширина окна

Источник

Учимся писать userscript’ы

Доброго времени суток всем желающим приобщиться к миру пользовательских скриптов (они же userscript, userJS, юзерскрипты).

В этой статье я хочу поведать о том, что такое юзерскрипты, c чем их едят и, главное, как их готовят!

Внимание: предполагается минимальное знание javascript.
На практике доказано: юзерскрипты может писать человек, не знакомый с программированием, но обладающий усидчивостью и желанием изучить javascript!
О том, что такое javascript и как с ним обращаться, можно узнать на javascript.ru.

Что такое юзерскрипты?

Кратко: юзерскрипт — это программа, написанная на языке JavaScript, хранящаяся на компьютере пользователя и подключаемая браузером на определенных страницах. Юзерскрипт представляет собой файл с расширением .user.js (именно по расширению браузеры понимают, что файл является юзерскриптом), содержащий метаданные и непосредственно javascript-код.

При подключении к странице юзерскрипт выполняется так же, как и обычные javascript-сценарии.
У юзерскрипта есть доступ к DOM-дереву страницы, в контексте которой он выполняется.
В современных браузерах у юзерскрипта есть доступ к localStorage и прочим HTML5 API.

Юзерскрипты поддерживаются всеми основными современными браузерами (и даже кое-как поддерживаются IE7 и выше).

Самый известный портал юзерскриптов — userscripts.org. Тут можно найти хранилище скриптов, инструменты управления своими скриптами на портале и, что не маловажно, отзывчивый форум (всё на английском).

Немного общей теории

Самыми распространенными являются скрипты под расширение GreaseMonkey для браузера Firefox.
Подробную информацию по GreaseMonkey и написанию юзерскриптов под GreaseMonkey можно узнать на http://wiki.greasespot.net.
Так сложилось исторически, что данный браузер был (и остаётся по сей день) первым, в котором поддержка юзерскриптов была выполнена на высоком уровне.

Не все скрипты, написанные для GreaseMonkey, могут запускаться в других браузерах. Причина в криворукости том, что во многих скриптах используется GM API — набор javascript-функций, специфичных для GreaseMonkey.

Особенности юзерскриптов

Код юзерскриптов может посмотреть любой желающий, вооруженный блокнотом.
Базовые знания javascript позволяют отсечь угрозу установки шпионских и вредоносных скриптов простым анализом кода скрипта (придётся задействовать мозг).

Важно:Если вы не доверяете автору скрипта, главное удостовериться, что скрипт не отсылает пользовательские данные (куки, вводимый текст) на сторонние сервисы!

Все юзерскрипты запускаются после того, как загрузились все основные элементы страницы, но ещё не загрузились картинки. Можно сказать, что юзерскрипты грузятся по событию DOMContentLoaded.
В любом случае, проверки на window.onload не нужны.

Каждый браузер накладывает свои ограничения на исполнение юзерскриптов, но в целом юзерскрипты могут делать почти всё, что могут скрипты на странице.
Чаще всего юзерскрипты используются для изменения интерфейса страницы или для добавления плюшек, блекджека и шлюх(юзерскрипты для социальных сетей).
Бывают и продвинутые юзерскрипты, которые представляют собой самостоятельные программы (аукционные и игровые боты, плагины-помощники и т.д).

Анатомия юзерскриптов

Юзерскрипт — это текстовый файл с расширением user.js. В начале файла располагается блок метаданных — описание самого скрипта. После блока метаданных следует javascript-код, который и будет исполняться браузером.

Рассмотрим тестовый скрипт, который показывает alert с текстом на определенной странице.

Важно: данный скрипт представляет собой оболочку для кроссбраузерных юзерскриптов. Этот же скрипт, но с английскими комментариями, можно стянуть с pastebin.com и использовать безнаказанно.

В самом начале располагается блок метаданных (в виде комментария).

Этот блок состоит из директив описания юзерскрипта. Ниже в таблице представлены основные директивы и их назначение.

Важно:Все директивы, как и сам блок метаданных, могут отсутствовать.

Важно: При отсутствии директив @ include или @ match, юзерскрипты будут запускаться на всех страницах.

Результат

Наш юзерскрипт готов к использованию!
Нет, серьёзно, вы можете скопировать код юзерскрипта в файл, назвать его my.user.js, и закинуть полученный файл в браузер (используйте Chrome или Firefox с установленным GreaseMonkey).

Конечно, наш юзерскрипт не обладает серьезными функциями, код выглядит страшным и малопривлекательным (для непосвященного человека). Но в итоге мы получили заготовку для кроссбраузерных юзерскриптов.
Это значит, что юзерскрипт можно запустить практически в любом современном браузере!
И это замечательно!

Источник

Скрипты, скрипты и скрипты! Что же это такое?

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

Коротенькая справочка или напоминание, это для кого как. Языки программирования делятся на две большие группы – компилируемые и интерпретируемые.

Первые, с помощью специальной программы компилятора, переводят программу, написанную программистом, в так называемые машинные коды, то есть в коды понятные процессору (или процессорам, как частный случай) компьютера, которые процессор может выполнять. В случае с компилятором программа хранится на диске и загружается в память (RAM) компьютера в машинных кодах (условно говоря, в ноликах и единичках).

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

Основное преимущество компилируемых программ по сравнению с интерпретируемыми, это скорость работы. Иногда эта скорость может быть выше на несколько порядков! Интерпретаторы, безусловно, будут работать медленнее, так как им приходится делать много побочной работы помимо выполнения основной программы. А ведь скорость выполнения программы для нас очень важна, особенно если мы создаем игру! Мы ведь не хотим видеть дергающихся и тормозящих персонажей, тем более слайд-шоу! Для нас ведь важно, будет созданный нами персонаж реагировать через 1 миллисекунду или только через 10 секунд.

Зачем нам вообще использовать интерпретируемый язык программирования для создания игр? И можно ли его использовать в принципе? Дело в том, что у интерпретируемых языков тоже есть свои преимущества, и одно из них то, что программу можно быстро отлаживать (т.е. исправлять ошибки), дополнять и изменять. Ведь программа хранится на диске в том виде, как её написал программист и её не нужно каждый раз перекомпилировать после исправления маленькой ошибки. Кстати, поэтому и разобраться в чужих программах проще – языки программирования, особенно ориентированные на написание скриптов, очень просты для понимания, а вот разобраться в машинных кодах без отличного знания ассемблера (что дано далеко не каждому) практически невозможно…

В общем, программистам всегда хотелось совместить скорость работы компилируемых языков и простоту отладки интерпретируемых. Результатом стал своеобразный гибрид, так называемый прекомпилируемый метод работы интерпретаторов. При этом программа хранится на диске в том виде, как её написал программист, но в момент загрузки в оперативную память компьютера она переводится (специальной программой, часто называемой препроцессором) или непосредственно в машинные коды или в более удобный для дальнейшей обработки промежуточный формат. Вот! Это как раз и есть наш вариант со скриптами в Мафии, да и в огромном количестве других игр Имеем хорошую скорость работы и простоту отладки, в частности моддинга.
Игра Mafia: The City of Lost Heaven написана на объектно-ориентированном языке С++, программисту это уже о многом говорит! Для непрограммистов поясню, что в соответствии с логикой этого языка, всё, что мы видим и многое из того, что не видим, описано в виде отдельных объектов. Каждый человек, каждая машина или здание, каждая коробка или телефонная будка, каждая дорога или выезд из города и т.д… в общем всё это объекты! Каждый объект относится к какому-нибудь классу, например, машины, друзья, полицейские и т.д. Чуть позже мы поговорим об этом подробнее, а сейчас нам важно только усвоить, что игра Мафия, вернее наш городок Лост Хэвен, весь состоит из объектов, он из них построен.

Теперь о скриптах. Скрипт, это сценарий, от английского слова «Script». Точно такой же сценарий или роль, как в театральной пьесе! На форуме Вебгеймера, как выяснилось, есть много театралов, людей, которые любят театр и разбираются в нем. Вот им-то должно быть понятно, о чем я веду речь. Вы никогда не обращали внимания, не задумывались, почему разработчики назвали игровые файлы сценами (scene.4ds, scene2.bin и т.д.), а объекты, из которых состоят эти файлы актерами (actors)? Или откуда пошло такое понятие как «игровая сцена»? Дело в том, что игровые скрипты-сценарии, особенно для игр типа «action» (кстати, еще одно словечко из шоу-бизнеса), очень похожи на сценарии и пьесы театральные, можно сказать, что они близкие родственники. И в том и в другом случае у нас есть сцена с расставленными декорациями и актерами (мизансцена), при этом у некоторых актеров есть свой сценарий, своя роль, свой экшен, а у некоторых этого нет, они как бы играют в массовке. Но ведь и массовка тоже важна, без нее у нас не получится целостности, полноты впечатления от спектакля.

Актер, в любом случае актер, независимо есть у него роль со словами и экшеном (свой скрипт) или он играет бессловесную статую. Как я говорил выше, все из чего состоит город, это объекты. Это верно и понятно любому программисту! Но в то же время любой объект является актером на нашей сцене, по терминологии программистов Illusion Softworks, и с точки зрения «театрального» подхода к скриптам, о чем я говорил выше. Позже попробуем разобраться с этим поподробнее, а пока просто запомним, что объект и актер, это одно и то же – называйте как вам удобнее. Главное, чтобы вы понимали, что бутылка и чашка, стоящие в баре у Луиджи, и сам Луиджи, это и объекты, и актеры одновременно.

Итак, мы построили сцену, расставили актеров и раздали им их роли (scripts), теперь они могут сыграть нам спектакль, а мы насладиться зрелищем, НО очень скоро это нам наскучит, ведь мы делаем игру, то есть хотим сами принять участие в спектакле, самому стать актером, а не только наблюдать за другими актерами. Тут есть один интересный момент! Все актеры имеют свои роли, в соответствии с которыми они выполняют какие-то действия, причем так, что со стороны может показаться, что актеры разумны. Создается впечатление, что актеры могут думать и принимать решения, что они обладают некоторым, достаточно убогим, но все-таки подобием искусственного интеллекта (Artificial Intelligence a.k.a. AI), для простоты часто и говорят, что игровые персонажи обладают AI. Закономерный вопрос, а если игрок выступает в качестве одного из актеров, то нужен ли игроку управляющий его поведением скрипт? У игрока ведь есть своя голова на плечах, часто и не пустая! Игрок сам может и должен принимать решения, в этом и заключается суть игрового процесса, зачем для игрока создавать дополнительный скрипт и AI. В простейшем случае для взаимодействия с AI других актеров, например: чтобы контролировать уровень здоровья игрока, чтобы он не залез куда не просят, чтобы отслеживать корректность прохождения миссии игроком (читы, например), чтобы завершить миссию, когда она пройдена. Таким образом, получается, что если для других актеров скрипты играют в основном управляющую роль, они думают и принимают решения за актеров, то в случае с игроком, скрипты больше ориентированы на контроль его поведения и взаимодействия с другими актерами.

А думать и принимать решения игроку предлагается самому.

Итак, определение скрипта.

Скрипт (script), это сценарий, описывающий и определяющий роль одного актера, его свойства, характеристики, поведение и взаимодействие с другими актерами.

Вы можете спросить, а как же, например, скрипт банды из Alive mod? Ведь не один актер составляет банду? Действительно, в банде несколько человек, у каждого из которых свой скрипт и свои функции, например, водитель… Все верно, каждый из членов банды является отдельным актером и имеет свой отдельный скрипт, описывающий его поведение и свойства. НО, в то же время, вместе члены банды составляют новый объект или актера, что одно и тоже. Если вам трудно это представить, то попробуйте представить, например, кирпич! Кирпич является объектом и относится к классу «Стройматериалы», из нескольких десятков или сотен кирпичей мы можем построить стену, которая тоже будет являться одним объектом, несмотря на то, что построена из множества других объектов, тех самых кирпичей. А из нескольких стен мы построим дом, который тоже является одним объектом, просто другого, более крупного класса «Дома», и так далее, до района и города в целом. В то же самое время наш маленький кирпич никуда не делся, он как был, так и остался объектом.

Точно так же преобразуются и скрипты, поскольку каждому объекту соответствует один скрипт, а объекты могут объединять в себе множество других объектов. Вот и получается, что каждый член банды имеет свой отдельный скрипт, у банды свой скрипт, а у миссии свой. Сложно представить? Ничего, в процессе работы будет понятнее, я надеюсь. А пока запомним, что одним актером могут управлять несколько различных скриптов, это зависит от того, к какому классу объектов он относится, и насколько сложные роли ему предстоит исполнять в этих классах.

Источник

Гайд для начинающих: как написать JavaScript

Современный интернет немыслим без скриптов. Учимся писать на JavaScript.

Если бы для интернета писали Библию, она начиналась бы так:

Сначала была почта. И увидели инженеры, что это хорошо. И создали они WWW с гиперссылками. И увидели инженеры, что это тоже хорошо. И создали они тогда язык JavaScript для оживления страничек.

Примерно так происходило в реальности. JavaScript придумали, чтобы «оживить» HTML. Скрипты JavaScript пишутся непосредственно в текст HTML или хранятся в отдельных файлах, как и стили CSS. Они выполняются сразу после загрузки страницы в браузер.

Даже сам язык в первое время назывался LiveScript. Потом его переименовали в JavaScript, потому что планировали как-то увязать с языком общего назначения Java. Но сейчас у них нет практически ничего общего, а JavaScript — совершенно независимый язык программирования со своей четкой спецификацией ECMAScript.

Формально JavaScript является торговой маркой Oracle, а этот язык — «расширение» ECMAScript, наряду с JScript от Microsoft и ActionScript, но это скорее заморочки владельцев торговых марок. Главное, что свободный ECMAScript никому не принадлежит.

Со временем сфера влияния JavaScript значительно расширилась. Его начали использовать не только для скриптов на странице HTML, но и для серьезных больших веб-приложений и целых программ, которые работают в браузере. Есть инструменты, чтобы специальным образом «упаковать» эти программы и выполнять их отдельно от браузера. Это компиляторы и интерпретаторы, которые более подробно рассматриваются на обучающих курсах «Java-разработчик» и «Веб-разработчик».

Приложения JavaScript выполняются в любой среде, где есть соответствующий интерпретатор.

Как сделать JavaScript? Написать элементарный скрипт не сложнее, чем простую HTML-страничку, ведь скрипты JavaScript пишутся обычным текстом, то есть их можно создавать буквально в том же «Блокноте», сохраняя потом в отдельных файлах или вставляя в тело HTML-документа. Самые простые вещи на JavaScript делаются действительно просто.

Как написать JavaScript

Для примера сделаем простой скрипт для выполнения сервером сценариев Windows. Этот скрипт можно написать прямо в «Блокноте» и выполнить без браузера.

Пишем этот текст в «Блокноте», затем сохраняем файл под именем skillbox.js и запускаем в «Проводнике» Windows.

alert()

Метод alert() отображает окошко с кнопкой «OK». В окне выводится сообщение, которое указано в скобках. Например, «Привет, Skillbox!». То есть в данном случае браузер делает ровно то же самое, что перед этим делал сервер сценариев Windows.

Эти примеры тоже можно писать в «Блокноте», только сохранять в файлах с расширением HTML. Например, skillbox.htm.

В качестве аргумента alert() можно указать не только конкретный текст, но и результат каких-либо вычислений или обработки других данных. Например, alert(x), где x вычисляется отдельно.

confirm()

Метод confirm() выводит такое же окно с сообщением, но уже с двумя кнопками — «ОК» и «Отмена». В зависимости от того, какую кнопку щелкнет пользователь, метод возвращает либо значение true, либо false. Сервер получает это возвращаемое значение от пользователя и выполняет какое-то действие, в зависимости от ответа.

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

prompt()

Метод prompt() выводит диалоговое окно с сообщением и текстовым полем, куда пользователь вводит данные. Здесь тоже предусмотрены две кнопки «ОК» и «Отмена». По нажатию первой кнопки метод возвращает на сервер введенный текст, а по нажатию второй кнопки возвращает логическое значение false.

Синтаксис здесь такой:

Значение поля ввода необязательно. Туда можно вписать текст, который изначально введен в поле для удобства пользователя.

Возможности современного JavaScript выходят далеко за рамки примитивного ввода-вывода данных через формы. Эти методы мы привели только в качестве самых простых примеров. Кроме этого, JavaScript позволяет реагировать на действия пользователя. Например, на движения мышкой или нажатие определенных клавиш. JavaScript часто используется для обеспечения асинхронной работы ( Технология AJAX), когда информация на странице обновляется без ее перезагрузки. В этом режиме данные отправляются на сервер и загружаются оттуда в интерактивном режиме. Кроме того, JavaScript способен манипулировать с HTML-элементами на странице (создавать и прятать теги и т.д.) и делать многое другое.

Полезные инструменты

Консоль разработчика

Во всех популярных браузерах есть специальная консоль разработчика. Она показывает код скриптов на странице, а также выводит другую полезную информацию. В Chrome, Firefox и IE консоль разработчика открывается по нажатию горячей клавиши F12, в Safari — Ctrl+Shift+I или Ctrl+Alt+C. На скриншоте скрипты отображаются справа вверху, вместе с другими элементами веб-страницы.

Редакторы кода

В дальнейшем для удобного программирования понадобится установить редактор кода или IDE (Integrated Development Environment), интегрированную среду разработки. IDE — это редактор с расширенной функциональностью, который интегрирован с другими полезными инструментами, поддерживает подключение дополнительных модулей и так далее.

Для начала можно рекомендовать один из легких редакторов:

В будущем есть смысл присмотреться к IDE:

Заключение

Инструкторы на курсе «JavaScript с нуля» посоветуют лучшие инструменты и помогут разобраться с любыми вопросами. Это практический 4-месячный курс для тех, кто хочет научиться основам языка сценариев с индивидуальным наставником, разработать фронтенд для интерактивного веб-проекта и положить кейс к себе в портфолио.

Курс идеально подойдет дизайнерам-разработчикам и начинающим программистам, кто уже знаком и умеет разрабатывать страницу на HTML и CSS, но не намерен останавливаться в изучении программирования. Преподаватели практически «на пальцах» объяснят базовые основы синтаксиса JavaScript, научат создавать визуальные интерактивные элементы и помогут разработать первый веб-проект на JavaScript.

Пишет про разработку в Skillbox. Работал главным редактором сайта «Хабрахабр», ведет корпоративные блоги.

Источник