Клиентский JavaScript. Справочник

         

Примеры


Пример 1. Якорь/anchor.

В этом примере определяется anchor для текста "Welcome to JavaScript":

<A NAME="javascript_intro"><H2>Welcome to JavaScript</H2></A>

Если вышеприведённый anchor находится в файле intro.html, ссылка в другом файле может определять переход на этот anchor таким образом:

<A HREF="intro.html#javascript_intro">Introduction</A>
Пример 2. Массив anchors.

Открываются два окна. Первое окно содержит серию кнопок, которые устанавливают location.hash во втором окне на определённый anchor. Во втором окне определены 4 якоря: "0", "1", "2" и "3." (Имена якорей в документе, следовательно, 0, 1, 2, ... (document.anchors.length-1)). Когда в первом окне нажимается кнопка, обработчик события onClick проверяет существование anchor, перед тем как установить в window2.location.hash имя специфицированного якоря.

link1.html, в котором определены первое окно и кнопки, содержит следующий код:

<HTML>
<HEAD>
<TITLE>Links and Anchors: Window 1</TITLE>
</HEAD>
<BODY>
<SCRIPT> window2=open("link2.html","secondLinkWindow",
   "scrollbars=yes,width=250, height=400")
function linkToWindow(num) {
   if (window2.document.anchors.length > num)
      window2.location.hash=num
   else
      alert("Anchor does not exist!")
}
</SCRIPT>

<B>Links and Anchors</B>
<FORM>
<P>Click a button to display that anchor in window #2
<P><INPUT TYPE="button" VALUE="0" NAME="link0_button"
   onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="1" NAME="link0_button"
   onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="2" NAME="link0_button"
   onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="3" NAME="link0_button"
   onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="4" NAME="link0_button"
   onClick="linkToWindow(this.value)">
</FORM>
</BODY>
</HTML>

link2.html, где находятся якоря, содержит следующий код:

<HTML>
<HEAD>
<TITLE>Links and Anchors: Window 2</TITLE>
</HEAD>
<BODY>
<A NAME="0"><B>Some numbers</B> (Anchor 0)</A>
<UL><LI>one
<LI>two
<LI>three
<LI>four</UL>
<P><A NAME="1"><B>Some colors</B> (Anchor 1)</A>
<UL><LI>red
<LI>orange
<LI>yellow
<LI>green</UL>
<P><A NAME="2"><B>Some music types</B> (Anchor 2)</A>
<UL><LI>R&B
<LI>Jazz
<LI>Soul
<LI>Reggae
<LI>Rock</UL>
<P><A NAME="3"><B>Some countries</B> (Anchor 3)</A>
<UL><LI>Afghanistan
<LI>Brazil
<LI>Canada
<LI>Finland
<LI>India</UL>
</BODY>
</HTML>



Содержание раздела