Программирование гиперссылок
Поможем в ✍️ написании учебной работы
Поможем с курсовой, контрольной, дипломной, рефератом, отчетом по практике, научно-исследовательской и любой другой работой

• Доступ к гиперссылкам:

l По имени/идентификатору

l В массиве document.links[]

l Объект имеет «тип» URL

• Объект ссылки имеет свойства и события

• Ссылка может иметь программный вид

l javascript: код

l результат работы кода может быть показан в браузере

l Результатом считается результат последнего выражения

l Приём void(0);

l Так можно не только в ссылке, но и в action у форм

Пример 45. Использование ссылок

<html>

<body>

<table border="1px" id="table">

<head id="head"><td> Фамилия </td><td> Имя </td></head>

<tr><td> Иванов </td><td> Иван </td></tr>

</table>

<form name="mainform">

Фамилия : <input type="text" name="sname"/><br/>

Имя : <input type="text" name="fname"/><br/>

</form>

<a href="javascript:appendToTable(document.mainform.fname.value,

                                 document.mainform.sname.value);

        void(0);"> Добавить </a>

<a href="javascript:document.mainform.submit();">

Отправить данные</ a >

Некоторые замечания

• Часто JavaScript воспринимается как набор приёмов по программированию клиентской части.

• Это не так.

• JavaScript – интересный и богатый язык с широкими возможностями.

• И детальное его изучение требует значительного времени…


 

HTML (самостоятельно)

HTML ( HyperTextMarkupLanguage ) – языкразметкигипертекста. Его предназначение - указывать браузеру, как разместить элементы на странице при ее отображении на экране монитора.

Например,

<b>Этот текст будет отображаться жирным</b>

<i>А этот - курсивом</i>

Бывают также теги одиночные, т.е. не требующие закрытия. Такие теги просто совершают определенное действие, например, перевод строки или вставку рисунка.

Теги могут иметь параметры (или атрибуты), например,

<body bgcolor="red"> Здесьсодержимое </body>


Структура HTML

Пример 30.

< html >

< head >

<title> Тег body в html</title>

<base href="http://www.my_site.ru/">

<link rel="stylesheet" type="text/css" href="style.css">

<meta http-equiv="Content-Type" content="text/html;charset=windows-1251">

< metahttp - equiv =" KEYWORDS " content ="тег, html , заголовок страницы">

< metahttp - equiv =" DESCRIPTION " content ="Описание элементов заголовка">

<script type="text/javascript" src="function.js"></script>

</head>

<body bgcolor="yellow" leftmargin="100" topmargin="50" rightmargin="50" bottommargin="50" text="gray" alink="red" vlink="green">

Простотекст

<br/>

<a href="index.html"> Ссылканастраницу index1.html</a>

<br/>

<a href="map.html"> Ссылканастраницу index2.html</a>

</ body >

</ html >

Теги <html></html> являются контейнером для всех остальных, т.е. в них помещаются все остальные. Таким образом, ваш документ должен начинаться с тега <html>, а заканчиваться тегом </html>.

Сам документ условно разделен на две части - заголовок документа (теги <head></head>) и тело документа (теги <body></body>). Заголовок документа содержит служебную информацию и не влияет на внешний вид документа. Его задачей является предоставление браузеру пользователя или серверу информации о том, как отобразить ваш документ.

Единственным обязательным элементом заголовка документа являются теги <title></title>. Они необходимы, чтобы дать документу название, оно отражается в заголовке окна браузера.

Одиночный тег <base> служит для указания полного URL-адреса документа. Зачем это нужно? Представьте, что вы сохранили какую-нибудь html-страницу себе на компьютер, с тем, чтобы просмотреть ее позже. Все картинки на этой страницы превратятся в красные крестики. Но если вы не отключены от сети, а на странице присутствует тег <base>, то браузер будет знать, где искать необходимый файл, найдет его и загрузит картинки.

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

У тега <link> несколько атрибутов:

href - указывает URL-адрес подключаемого файла.

rel - указывает на тип отношения данного документа к внешнему (например: rel="stylesheet" указывает, что внешний файл определяет стиль текущего документа).

type - указывает тип и параметры присоединенной таблицы стилей.

Информация в этом теге не имеет никакого отношения к HTML, однако ее использование очень удобно для решения ряда задач:

- указание кодировки страницы, например, для русского текста в кодировке Windows;

- указание ключевых слов страницы (используется при оптимизации страниц);

-  указание краткого описания страницы.

Возможны и другие варианты. Рассмотрим параметры тега <meta>:

http-equiv - определяет свойство тега (тип контента, ключевые слова, описание и т.д.).

name - используется для дополнительного описания тега, если отсутствует, то считаеся эквивалентным параметру http-equiv.

content - значение параметра http-equiv.

Теги <script></script>используются для подключения внешних файлов скриптов. Это позволяет оптимизировать код страниц. Например, если вы используете функции java script для большинства своих страниц, то поместив эти функции на отдельную страницу - function.js, с помощью тега <script> можно указать путь к этой странице.

Это повышает читабельность кода и ускоряет загрузку страниц. У этого тега несколько параметров:

language - указывает язык написания скрипта, в спецификации HTML 4.0 данный параметр не рекомендуется к употреблению. Вместо него следует указывать параметр type.

type - указывает тип MIME для языка.

src - указывает путь к внешнему файлу со скриптами.

Все, что отображается на web-странице, находится в тегах <body></body>. Это текст, картинки и исполняющиеся скрипты, а также теги для оформления всего этого.

Обязательных параметров у тега <body>нет, да и применение необязательных параметров тоже не приветствуется. Тем не менее, большинство параметров до сих пор поддерживается разными браузерами. Рассмотрим те, которые пока поддерживаются всеми браузерами:

alink - устанавливает цвет активной ссылки. Текущий цвет ссылки меняется на активный при нажатии на нее.

vlink - устанавливает цвет посещенной ссылки, т.е. той, по которой уже щелкали.

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

bgcolor - указывает фоновый цвет документа.

leftmargin - определяет отступ от левого края окна браузера до контента страницы.

rightmargin - определяет отступ от правого края окна браузера до контента страницы.

topmargin - определяет отступ от верхнего края окна браузера до контента страницы.

bottommargin - определяет отступ от нижнего края окна браузера до контента страницы.

text - устанавливает цвет текста для всего документа.

Дата: 2019-02-19, просмотров: 261.