Wykorzystanie skryptów na stronie internetowej – przykładowe testy Proszę przećwiczyć i przeanalizować poniższe skrypty
Test1
<HTML>
<HEAD>
<meta charset="UTF-8">
<TITLE> Miary liczbowe </TITLE>
<script type="text/javascript">
function test(){
if (pyt1.value=="144"&& pyt2.value=="60" && pyt3.value=="15" && pyt4.value=="12") {
zamiana.innerHTML="dobrze! Gros to 12 tuzinów, <BR> tuzin to 12 sztuk, <BR> mendel stanowi 1/4 kopy, <BR> a kopa to 60 sztuk.";
zamiana.className="redText";
kolumna1.innerHTML="";
}else{
kolumna1.innerHTML="<H2> Żle!!</H2>";
zamiana.innerHTML="";
}}
</script>
<STYLE>
.redText {font-family: arial; font-size:10pt; font-style:normal; color:red;}
.blueText {font-family: arial; font-size:12pt; font-style:italic; color:blue;}
</STYLE>
</HEAD>
<BODY BGCOLOR=#FFFFF)>
<H3> Czy znasz sie na dawnych jednostkach miary?</H3>
<TABLE>
<TR>
<TD id="kolumna1"></TD>
<TD id="zamiana" CLASS="blueText" width=150> Liczba elementów</TD>
</TR>
<TR>
<TD><DIV CLASS="blueText"> Gros </DIV></TD>
<TD><INPUT type="text" id="pyt1" SIZE=2 ></TD>
</TR>
<TR>
<TD><DIV CLASS="blueText"> Kopa </DIV></TD>
<TD><INPUT id="pyt2" SIZE=2></TD>
</TR>
<TR>
<TD><DIV CLASS="blueText"> Mendel </DIV></TD>
<TD><INPUT id="pyt3" SIZE=2></TD>
</TR>
<TR>
<TD><DIV CLASS="blueText"> Tuzin </DIV></TD>
<TD><INPUT id="pyt4" SIZE=2></TD>
</TR>
<TR>
<TD></TD>
<TD><INPUT type="button" value="sprawdź" onclick="test();"> </TD>
</TR>
Test2
<HTML>
<HEAD>
<meta charset="UTF-8">
<TITLE> Test </TITLE>
<script type="text/javascript">
function test(){
if (pyt1.value=="2"&& pyt2.value=="1")
kolumna1.innerHTML="<IMG SRC=\"tak.jpg\" width=50>";
elsekolumna1.innerHTML="<IMG SRC=\"nie.jpg\" width=50>";;
}
function test2() {
if (pyt5.value=="1"&& pyt6.value=="2")
kolumna2.innerHTML="<IMG SRC=\"tak.jpg\" width=50>";
elsekolumna2.innerHTML="<IMG SRC=\"nie.jpg\" width=50>";;
}</script>
<STYLE>
.redText {font-family: arial; font-size:10pt; font-style:normal; color:red;}
.blueText {font-family: arial; font-size:12pt; font-style:italic; color:blue;}
</STYLE>
</HEAD>
<BODY BGCOLOR=#FFFFF)>
<H3> Uszereguj auta w kolejności parametrów</H3>
<TABLE>
<TR>
<TD></TD><TD></TD>
<TD id="kolumna1"></TD>
<TD id="kolumna2"></TD>
</TR>
<TR>
<TD></TD><TD></TD>
<TD CLASS="blueText" width=150> <H5>Moc </H5></TD>
<TD CLASS="blueText" width=150> <H5>Przyspieszenie</H5></TD>
</TR>
<TR>
<TD><IMG SRC="fiat.jpg" width=100></TD>
<TD><DIV id="fiat" CLASS="blueText">FIAT</DIV></TD>
<TD> <INPUT id="pyt1" size=2</TD>
<TD> <INPUT id="pyt2" size=2</TD>
</TR>
<TR>
<TD><IMG SRC="ford.jpg" width=100></TD>
<TD><DIV id="ford" CLASS="blueText">FORD</DIV></TD>
<TD> <INPUT id="pyt5" size=2</TD>
<TD> <INPUT id="pyt6" size=2</TD>
</TR>
<TD></TD><TD></TD>
<TD><INPUT type="button" value="sprawdź" onclick="test();"></INPUT></TD>
<TD><INPUT type="button" value="sprawdź" onclick="test2();"></INPUT></TD>
</TABLE>
</BODY>
</HTML>
TEST3
<HTML>
<HEAD>
<meta charset="UTF-8">
<TITLE> Test </TITLE>
<script type="text/javascript">
var srcElement function odp1(){
srcElement=window.event.srcElement;
if (pyt1.style.color=="blue") { if (srcElement.id=="A11") { srcElement.src="tak.jpg";
pyt1.style.color="green"
}else{
srcElement.src="nie.jpg";
pyt1.style.color="red"
}A1.innerHTML= "najwieksza moc ma silnik małego fiata :)"
}
}function start() {
location=document.formularz.menu.options[document.formularz.menu.selectedIndex].value }</script>
</HEAD>
<BODY BGCOLOR=#FFFFF)>
<H3> test auta</H3> <HR><BR>
<form name="formularz">
<P> <SELECT name="menu" size="1">
<OPTION value="pytanie1.html"> Pytanie1</option>
<OPTION value="pytanie2.html"> Pytanie2</option>
<OPTION value="pytanie3.html"> Pytanie3</option>
</SELECT></P>
<input type="button" name="test" value="załaduj test" onclick="start()">
</FORM>
<H3> <P id="pyt1" style="color:blue"><B> Pytanie1: </B>
<BR> Który z samochodów ma najwiekszą moc?
<TABLE>
<TR>
<TD><IMG SRC="fiat.jpg" width="100" height="100" id="A11" onclick="odp1();"></TD>
<TD><IMG SRC="ford.jpg" width="100" height="100" id="A12" onclick="odp1();"></TD>
<TD><IMG SRC="porsche.jpg" width="100" height="100" id="A13" onclick="odp1();"></TD>
<TD><IMG SRC="lambo.jpg" width="100" height="100" id="A14" onclick="odp1();"></TD>
</TR>
</TABLE>
<p id="A1"></P>
</BODY>
</HTML>
