Общие теоретические сведения — КиберПедия 

Археология об основании Рима: Новые раскопки проясняют и такой острый дискуссионный вопрос, как дата самого возникновения Рима...

Биохимия спиртового брожения: Основу технологии получения пива составляет спиртовое брожение, - при котором сахар превращается...

Общие теоретические сведения

2017-06-29 332
Общие теоретические сведения 0.00 из 5.00 0 оценок
Заказать работу

 

Java Script – прототипно-ориентированный сценарный язык программирования. Является диалектом языка ECMA Script.

Java Script обычно используется как встраиваемый язык для программного доступа к объектам приложений. Наиболее широкое применение находит в браузерах как язык сценариев для придания интерактивности веб-страницам.

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

На Java Script оказали влияние многие языки, при разработке была цель сделать язык похожим на Java, но при этом лёгким для использования непрограммистами. Языком Java Script не владеет какая-либо компания или организация, что отличает его от ряда языков программирования, используемых в веб-разработке.

HTML (от англ. HyperText Markup Language – «язык разметки гипертекста») – стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц создаются при помощи языка HTML (или XHTML). Язык HTML интерпретируется браузерами и отображается в виде документа в удобной для человека форме.

HTML является приложением («частным случаем») SGML (стандартного обобщённого языка разметки) и соответствует международному стандарту ISO 8879. XHTML же является приложением XML.

Веб-страница (англ. Web page) – документ или информационный ресурс Всемирной паутины, доступ к которому осуществляется с помощью веб-браузера.

Веб-страницы обычно создаются на языках разметки HTML и могут содержать гиперссылки для быстрого перехода на другие страницы.

Динамическая страница – веб-страница, сгенерированная программно, в отличие от статичной страницы, которая является просто файлом, лежащим на сервере. Сервер генерирует HTML код динамической страницы для обработки браузером или другим агентом пользователя.

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

- PHP – для серверов Apache и других под управлением GNU/Linux, других UNIX-подобных, и прочих ОС;

- JSP и Java Servlet – для серверов Apache, JBoss, Tomcat под управлением различных ОС;

- ASP.NET – для Microsoft Windows серверов под управлением IIS.

Основные положения. Все тэги HTML начинаются с «<«(левой угловой скобки) и заканчиваются символом «>«(правой угловой скобки). Как правило, существует стартовый тэг и завершающий тэг. Для примера приведем тэги заголовка, определяющие текст, находящийся внутри стартового и завершающего тэга и описывающий заголовок документа:

<TITLE> Заголовок документа </ title>

Завершающий тэг выглядит также, как стартовый, и отличается от него прямым слэшем перед текстом внутри угловых скобок. В данном примере тэг <TITLE> говорит WEB-браузеру об использовании формата заголовка, а тэг </ TITLE> - о завершении текста заголовка.

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

HTML не реагирует на регистр символов, описывающих тэг, и приведенный ранее пример может выглядеть следующим образом:

<title> Заголовок документа </ TITLE>

Примечание. Дополнительные пробелы, символы табуляции и возврата каретки, добавленные в исходный текст HTML-документа для его лучшей читаемости, будут проигнорированы WEB-браузером при интерпретации документа. HTML-документ может включать вышеописанные элементы только, если они помещены внутрь тэгов <PRE> и </ PRE>. Более подробно о тэгах <PRE> будет написано ниже.

Структура документа. Когда WEB-браузер получает документ, он определяет, как документ должен быть интерпретирован. Самый первый тэг, который встречается в документе, должен быть тэгом <HTML>. Данный тэг сообщает WEB-браузеру, что ваш документ написан с использованием HTML. Минимальный HTML-документ будет выглядеть так:

<HTML>... Тело документа... </ HTML>

Заголовочная часть документа <HEAD>. Тэг заголовочной части документа должен быть использован сразу после тэга <HTML> и более нигде в теле документа. Данный тэг представляет из себя общее описание документа. Избегайте размещать какой-либо текст внутри тэга <HEAD>. Стартовый тэг <HEAD> помещается непосредственно перед тэгом <TITLE> и другими тэгами, описывающими документ, а завершающий тэг </ HEAD> размещается сразу после окончания описания документа. Например:

<HTML>

<HEAD>

<TITLE>Список сотрудников</TITLE>

</ HEAD>

...

Примечание. Технически, стартовые и завершающие тэги типа <HTML>, <HEAD> и <BODY> необязательны. Но настоятельно рекомендуется их использовать, поскольку использование данных тэгов позволяет WEB-браузеру уверенно разделить заголовочную часть документа и непосредственно смысловую часть.

Заголовок документа <TITLE>

Большинство WEB-браузеров отображают содержимое тэга <TITLE> в заголовке окна, содержащего документ и в файле закладок, если он поддерживается WEB-браузером. Заголовок, ограниченный тэгами <TITLE> и </ TITLE>, размещается внутри <HEAD>-тэгов, как показано выше на примере. Заголовок документа не появляется при отображении самого документа в окне.

Комментарии. Как любой язык, HTML позволяет вставлять в тело документа комментарии, которые сохраняются при передаче документа по сети, но не отображаются браузером. Синтаксис комментария:

<! - Это комментарий ->

Комментарии могут встречаться в документе где угодно и в любом количестве.

Тэги тела документа. Тэги тела документа идентифицируют отображаемые в окне компоненты HTML-документа. Тело документа может содержать ссылки на другие документы, текст и другую форматированную информацию.

Тело документа <BODY>. Тело документа должно находиться между тэгами <BODY> и </ BODY>. Это та часть документа, которая отображается как текстовая и графическая (смысловая) информация вашего документа.

 

ПОРЯДОК ВЫПОЛНЕНИЯ РАБОТЫ

Интеграция карт с YandexMap

 

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

Создать текстовый документ (блокнот) формата.txt, где будет код программы:

 

<!DOCTYPE html>

<html>

<head>

<meta http-equiv = “Content-Type” content= “text/html; charset=utf-8” />

<title>YandexMap Example</title>

</head>

<body>

<!-- задаем стиль и разметку страницы. -->

<div id=“map” style=“width:800px; height:600px”></div>

</body>

</html>

Следующий шаг, написание кода создания карты внутри тега <Head>:

 

<!--

Подключаем API карт

Параметры:

-load=package.standart - основные компоненты;

-lang=ru-Ru - язык русский.

-->

<script src = “http://api-maps.yandex.ru/2.0/?load=package.standart&lang=ru-RU” type=“text/javascript”> </script> <script type=“text/javascript”>

Var myMap;

 

//Дождемся загрузки API и готовности DOM.

ymaps.ready(init);

function init () {

//Создание экземпляра карты и его привязка

//к контейнеру с заданным id(“map”).

myMap = new ymaps.Map(‘map’,{

//При инициализации карты обязательно нужно //указать ее центр и коэффициент //масштабирования.

center:[55.76, 37.64], //Москва

zoom:10

});

} </script>

 

Далее, необходимо сохранить текстовый документ в формате.html и открыть его с помощью ве-бразера. В результате должна открыться карта (рис. 2.1).

 

Рис. 2.1. Созданная карта

Добавление пользовательского интерфейса (код следует писать внутри тега <Head>):

 

<script type = “text/javascript”>

ymaps.ready(){

//Для добавления элемента управления на

//карту используется поле map.controls.

//Это поле содержит ссылку на экземпляр

//класса map.control.Manager.

 

//Добавление элемента в коллекцию производится

//с помощью метода add.

 

//В метод add можно передать строковый //идентификатор элемента управления и

//его параметры.

 

myMap.controls

//Кнопка изменения масштаба

.add(‘zoomControl’, { left: 5, top: 5})

//Список типов карты

.add(‘typeSelector’)

//Стандартный набор кнопок

.add(‘mapTools’, {left: 35, top: 5});

//Также в метод add можно передать

//экземпляр класса элемента управления.

//Например, панель управления пробками.

var trafficControl = new ymaps.control.TrafficControl();

myMap.Controls

.add(trafficControl)

 

//В конструкторе элемента управления

//можно задавать расширенные параметры,

//например, тип карты в обзорной карте.

.add(new ymaps.MiniMap({

type: ‘yandex#publicMap’

}));}

 

В результате, приложение примет следующий вид, как показано на рисунке 2.2.

 

Рис. 2.2. Конечный вид карты

Интеграция карт с 2GIS

 

Используя картографическую базу данных 2GIS, необходимо написать код для веб-приложения.

Для этого создается текстовый документ (блокнот) формата.txt, где будет код программы:

 

<!DOCTYPE html>

<html>

<head>

<title>2GIS Example</title>

</head>

<body>

<div id = “myMapId” style = “width: 500 px; height: 400 px”></div>

</body>

</html>

 

Далее, пишется код создания карты внутри тега <Head>:

 

<script type = “text/javascript” src = “http://maps.api.2gis.ru/1.0”> </script>

<script type = “text/javascript”>

//Создаем обработчик загрузки страницы:

DG.autoload(function(){

//Создаем объект карты,

//связанный с контейнером:

var myMap = new DG.Map(‘myMapId’);

//Устанавливаем центр карты и

//коэффициент масштабирования:

myMap.setCenter (new DG.GeoPoint

(82.927810142519, 55.028936234826), 15);

}); </script>

 

и сохраняется текстовый документ в формате.html (рис. 2.3).

 

Рис. 2.3. Созданная карта

Код добавления пользовательского интерфейса (внутри тега <Head>, сам код должен быть написан внутри тега <script>):

 

//Добавляем элементуправления с

//коэффициентом масштабирования:

myMap.Controls.add(new DG.Controls.Zoom());

//Создаем балун:

var myBalloon = new DG.Balloons.Common({

//Местоположение на которое указывает балун:

geoPoint: new DG.GeoPoint(82.927810142519, 55.028936234826),

//Устанавливаем текст, который будет отображаться

//при открытии балуна:

contentHtml: ‘Привет!<br>Вы кликнули по мне:)’

});

//Создаем маркер:

var myMarker = new DG.Markers.Common({

//Местоположение на которое указывает маркер:

geoPoint: new DG.GeoPoint(82.927810142519, 55.028936234826),

//Функция, вызываемая при клике по маркеру:

clickCallback: function() {

//Если балун еще не был добавлен на карту,

//добавляем его:

if(! myMap.balloons.getDefaultGroup().contains(myBalloon)){

myMap.balloons.add(myBalloon);

} else {

//Показываем уже ранее добавленный

//на карту балун

myBalloon.show(); }

}

});

//Добавить маркер на карту:

myMap.markers.add(myMarker);

 

Конечный вид карты приведен на рисунке 2.4.

 

Рис. 2.4. Конечный вид карты

 

 


Поделиться с друзьями:

Автоматическое растормаживание колес: Тормозные устройства колес предназначены для уменьше­ния длины пробега и улучшения маневрирования ВС при...

Состав сооружений: решетки и песколовки: Решетки – это первое устройство в схеме очистных сооружений. Они представляют...

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

Индивидуальные и групповые автопоилки: для животных. Схемы и конструкции...



© cyberpedia.su 2017-2024 - Не является автором материалов. Исключительное право сохранено за автором текста.
Если вы не хотите, чтобы данный материал был у нас на сайте, перейдите по ссылке: Нарушение авторских прав. Мы поможем в написании вашей работы!

0.071 с.