Программирование на JavaScript

Лабораторная работа №1 Лабораторная работа №2 Лабораторная работа №3 Лабораторная работа №4 Лабораторная работа №5

Лабораторная работа №5

Задание 1. Создать страницу Арифметика, на которой вводится четыре числа и вычисляется сумма, разность, произведение и частное (рисунок 1).

Рисунок 1. Окно страницы Арифметика

Листинг программы:


01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43	`<HTML>` `<HEAD>` `<title>Арифметика</title>` `<SCRIPT` `LANGUAGE="JavaScript">` `function val (obj){` `var a1 =Number(obj.numl.value);` `var a2 =Number(obj.num2.value);` `var a3 =Number(obj.num3.value);` `var a4 =Number(obj.num4.value);` `var s = a1 + a2 + a3 + a4;` `var r = a1 - a2 - a3 - a4;` `var p = a1 * a2 * a3 * a4;` `var d = a1 / a2 / a3 / a4;` `obj.res.value = s;` `obj.res1.value = r;` `obj.res2.value = p;` `obj.res3.value = d;` `}` `</SCRIPT>` `</HEAD>` `<BODY>` `Введите числа` `<br>` `<FORM` `name="forml">` `<pre>` `число а1: <INPUT` `type="text"` `size=3` `name="numl">` `число а2: <INPUT` `type="text"` `size=3` `name="num2">` `число а3: <INPUT` `type="text"` `size=3` `name="num3">` `число а4: <INPUT` `type="text"` `size=3` `name="num4">` `</pre>` `<hr>` `<pre>` `Сумма чисел: <INPUT` `type="text"` `size=6` `name="res">` `Разность чисел: <INPUT` `type="text"` `size=6` `name="res1">` `Произведение чисел: <INPUT` `type="text"` `size=6` `name="res2">` `Частное чисел: <INPUT` `type="text"` `size=6` `name="res3">` `</pre>` `<hr>` `<INPUT` `type="button"` `value=Вычислить` `onClick="val(forml)">` `<INPUT` `type="reset"` `value="Обновить ">` `</FORM>` `</BODY>` `</HTML>`

<HTML>
    <HEAD>
        <title>Арифметика</title>
        <SCRIPT LANGUAGE="JavaScript">
            function val (obj){
                var a1 =Number(obj.numl.value);
                var a2 =Number(obj.num2.value);
                var a3 =Number(obj.num3.value);
                var a4 =Number(obj.num4.value);
                var s = a1 + a2 + a3 + a4;
                var r = a1 - a2 - a3 - a4;
                var p = a1 * a2 * a3 * a4;
                var d = a1 / a2 / a3 / a4;
                obj.res.value = s;
                obj.res1.value = r;
                obj.res2.value = p;
                obj.res3.value = d;
            }
        </SCRIPT>
    </HEAD>
    <BODY>
        Введите числа
        <br>
        <FORM name="forml">
            <pre>
                число а1: <INPUT type="text" size=3 name="numl">
                число а2: <INPUT type="text" size=3 name="num2">
                число а3: <INPUT type="text" size=3 name="num3">
                число а4: <INPUT type="text" size=3 name="num4">
            </pre>
            <hr>
            <pre>
                Сумма чисел: <INPUT type="text" size=6 name="res">
                Разность чисел: <INPUT type="text" size=6 name="res1">
                Произведение чисел: <INPUT type="text" size=6 name="res2">
                Частное чисел: <INPUT type="text" size=6 name="res3">
            </pre>
            <hr>
            <INPUT type="button" value=Вычислить onClick="val(forml)">
            <INPUT type="reset" value="Обновить ">
        </FORM>
    </BODY>
</HTML>

Задание 2. Даны 3 стороны треугольник а, b, c. Вычислить площадь треугольника и результат вывести в другой странице.

Рисунок 2. Страница с вводом сторон треугольника

Листинг программы:


01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40	`<HTML>` `<HEAD>` `<title>Объект Math</title>` `<SCRIPT` `language="JavaScript">` `function care(obj) {` `var a = Number(obj.st1.value);` `var b = Number(obj.st2.value);` `var c = Number(obj.st3.value);` `var s;` `p = a + b + c;` `document.writeln("Периметр треугольника равен - ", p, "<br>");` `p = p / 2;` `s = Math.sqrt(p * (p - a) * (p - b) * (p - c));` `document.writeln("Площадь треугольника равна - ", s);` `}` `</SCRIPT>` `</HEAD>` `<BODY>` `<p>` `Пример сценария с математической функцией` `</p>` `<p>` `Вычисление площади и периметра треугольника` `</p>` `<form` `name="form1">` `Сторона а:` `<INPUT` `type="text"` `size="3"` `name="st1">` `<br>` `Сторона b:` `<INPUT` `type="text"` `size="3"` `name="st2">` `<br>` `Сторона c:` `<INPUT` `type="text"` `size="3"` `name="st3">` `<br>` `<hr>` `<INPUT` `type="button"` `value="Вычислить"` `onclick="care(form1)">` `<INPUT` `type="reset"` `value="Обновить ">` `</FORM>` `</BODY>` `</HTML>`

<HTML>
    <HEAD>
        <title>Объект Math</title>
        <SCRIPT language="JavaScript">
            function care(obj) {
                var a = Number(obj.st1.value);
                var b = Number(obj.st2.value);
                var c = Number(obj.st3.value);
                var s;
                p = a + b + c;
                document.writeln("Периметр треугольника равен  -  ", p, "<br>");
                p = p / 2;
                s = Math.sqrt(p * (p - a) * (p - b) * (p - c));
                document.writeln("Площадь треугольника равна  - ", s);
            }
        </SCRIPT>
    </HEAD>
    <BODY>
        <p>
            Пример сценария с математической функцией
        </p>
        <p>
            Вычисление площади и периметра треугольника
        </p>
        <form name="form1">
            Сторона а:
            <INPUT type="text" size="3" name="st1">
            <br>
            Сторона b:
            <INPUT type="text" size="3" name="st2">
            <br>
            Сторона c:
            <INPUT type="text" size="3" name="st3">
            <br>
            <hr>
            <INPUT type="button" value="Вычислить" onclick="care(form1)">
            <INPUT type="reset" value="Обновить ">
        </FORM>
    </BODY>
</HTML>

Задание 3. На странице произвести подсчет баллов полученных по предметам.

Рисунок 3. Окно страницы с подсчетом баллов

Листинг программы:


01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32	`<HTML>` `<HEAD>` `<title>` `Формирование результата в поле формы` `</title>` `<SCRIPT` `language="JavaScript">` `function val(obj) {` `var a1 = Number(obj.numl.value);` `var a2 = Number(obj.num2.value);` `var a3 = Number(obj.num3.value);` `var a4 = Number(obj.num4.value);` `var s = a1 + a2 + a3 + a4;` `obj.res.value = s;` `}` `</SCRIPT>` `</HEAD>` `<BODY>` `Введите полученные оценки` `<br>` `<FORM` `name="forml">` `<pre>` `алгебра: <INPUT` `type="text"` `size=3` `name="numl">` `геометрия: <INPUT` `type="text"` `size=3` `name="num2">` `история: <INPUT` `type="text"` `size=3` `name="num3">` `анализ:<INPUT` `type="text"` `size=3` `name="num4">` `Сумма баллов: <INPUT` `type="text"` `size=4` `name="res">` `</pre>` `<INPUT` `type="button"` `value="Вычислить"` `onclick="val(forml)">` `<INPUT` `type="reset"` `value="Обновить ">` `</FORM>` `</BODY>` `</HTML>`

<HTML>
    <HEAD>
        <title>
            Формирование результата в поле формы
        </title>
        <SCRIPT language="JavaScript">
            function val(obj) {
                var a1 = Number(obj.numl.value);
                var a2 = Number(obj.num2.value);
                var a3 = Number(obj.num3.value);
                var a4 = Number(obj.num4.value);
                var s = a1 + a2 + a3 + a4;
                obj.res.value = s;
            }
        </SCRIPT>
    </HEAD>
    <BODY>
        Введите полученные оценки
        <br>
        <FORM name="forml">
            <pre>
                алгебра: <INPUT type="text" size=3 name="numl">
                геометрия: <INPUT type="text" size=3 name="num2">
                история: <INPUT type="text" size=3 name="num3">
                анализ:<INPUT type="text" size=3 name="num4">
                Сумма баллов: <INPUT type="text" size=4 name="res">
            </pre>
            <INPUT type="button" value="Вычислить" onclick="val(forml)">
            <INPUT type="reset" value="Обновить ">
        </FORM>
    </BODY>
</HTML>