|
|
@@ -0,0 +1,222 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html>
|
|
|
+ <head>
|
|
|
+ <title>Modul2</title>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ </head>
|
|
|
+ <body>
|
|
|
+<style>
|
|
|
+
|
|
|
+#div { height: 400px;
|
|
|
+ width: 400px;
|
|
|
+ overflow: auto;
|
|
|
+ border: 10px solid red;
|
|
|
+}
|
|
|
+
|
|
|
+#text {height: 600px;
|
|
|
+ width: 3000px;
|
|
|
+ background-color: blueviolet;
|
|
|
+ }
|
|
|
+#id4{color:white;
|
|
|
+font-weight: bold;
|
|
|
+font-size: large;
|
|
|
+background-color: blueviolet;}
|
|
|
+
|
|
|
+#id41{color:white;
|
|
|
+font-weight: bold;
|
|
|
+font-size: large;
|
|
|
+background-color: blueviolet;}
|
|
|
+
|
|
|
+#id42{color:white;
|
|
|
+font-weight: bold;
|
|
|
+font-size: large;
|
|
|
+background-color: blueviolet;}
|
|
|
+
|
|
|
+#id43{color:white;
|
|
|
+font-weight: bold;
|
|
|
+font-size: large;
|
|
|
+background-color: blueviolet;}
|
|
|
+
|
|
|
+
|
|
|
+#table1{background-color: blueviolet; border: 10px solid red};
|
|
|
+</style>
|
|
|
+<!--<button>Ввод Таблицы</button>
|
|
|
+<table id="table1"><tr></tr></table>-->
|
|
|
+
|
|
|
+ <button id="color">COLOR</button>
|
|
|
+ <button id="size">SIZE</button>
|
|
|
+ <button id="back">BACK</button>
|
|
|
+ <p>hello field</p>
|
|
|
+
|
|
|
+ <button id="id4" name="button">ВЛЕВО</button>
|
|
|
+ <button id="id41" name="button">ВПРАВО</button>
|
|
|
+ <button id="id42" name="button">ВВЕРХ</button>
|
|
|
+ <button id="id43" name="button">ВНИЗ</button>
|
|
|
+
|
|
|
+
|
|
|
+ <div id="div">
|
|
|
+ <div id="text">
|
|
|
+ var but1 = document.createElement('button');
|
|
|
+ but1.className = "prev";
|
|
|
+ but1.id = "but11";"</br>";
|
|
|
+ but1.innerHTML = "кнопка назад";
|
|
|
+ document.body.appendChild(but1);+"</br>";
|
|
|
+ var but1 = document.createElement('button');
|
|
|
+ but1.className = "prev";
|
|
|
+ but1.id = "but11";
|
|
|
+ but1.innerHTML = "кнопка назад";
|
|
|
+ document.body.appendChild(but1);
|
|
|
+ var but1 = document.createElemen"</br>";t('button');
|
|
|
+ but1.className = "prev";
|
|
|
+ but1.id = "but11";
|
|
|
+ but1.innerHTML = "кнопка назад";
|
|
|
+ document.body.appendChild(but1);"</br>";
|
|
|
+ var but1 = document.createElement('button');
|
|
|
+ but1.className = "prev";
|
|
|
+ but1.id = "but11";"</br>";
|
|
|
+ but1.innerHTML = "кнопка назад";
|
|
|
+ document.body.appendChild(but1);
|
|
|
+ var but1 = document.createElement('button');
|
|
|
+ but1.className = "prev";
|
|
|
+ but1.id = "but11";"</br>";
|
|
|
+ but1.innerHTML = "кнопка назад";
|
|
|
+ document.body.appendChild(but1);+"</br>";
|
|
|
+ var but1 = document.createElement('button');
|
|
|
+ but1.className = "prev";
|
|
|
+ but1.id = "but11";
|
|
|
+ but1.innerHTML = "кнопка назад";
|
|
|
+ document.body.appendChild(but1);
|
|
|
+ var but1 = document.createElemen"</br>";t('button');
|
|
|
+ but1.className = "prev";
|
|
|
+ but1.id = "but11";
|
|
|
+ but1.innerHTML = "кнопка назад";
|
|
|
+ document.body.appendChild(but1);"</br>";
|
|
|
+ var but1 = document.createElement('button');
|
|
|
+ but1.className = "prev";
|
|
|
+ but1.id = "but11";"</br>";
|
|
|
+ but1.innerHTML = "кнопка назад";
|
|
|
+ document.body.appendChild(but1);
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <script>
|
|
|
+
|
|
|
+/*scrollButtons (3)______________________________________________________________________________________________________
|
|
|
+
|
|
|
+document.getElementById('id4').onclick= function Passik() {
|
|
|
+ var elem = document.getElementById("div");
|
|
|
+ elem.scrollLeft += 50;
|
|
|
+
|
|
|
+};
|
|
|
+document.getElementById('id41').onclick= function Passik1() {
|
|
|
+ var elem = document.getElementById("div");
|
|
|
+ elem.scrollLeft -= 50;
|
|
|
+
|
|
|
+};
|
|
|
+document.getElementById('id42').onclick= function Passik2() {
|
|
|
+ var elem = document.getElementById("div");
|
|
|
+ elem.scrollTop += 50;
|
|
|
+
|
|
|
+};
|
|
|
+document.getElementById('id43').onclick= function Passik3() {
|
|
|
+ var elem = document.getElementById("div");
|
|
|
+ elem.scrollTop -= 50;
|
|
|
+
|
|
|
+};
|
|
|
+
|
|
|
+
|
|
|
+ //*setPropertyBySelector (2)_______________________________________________________________________________________________
|
|
|
+
|
|
|
+ document.getElementById('color').onclick = function() {
|
|
|
+ document.body.style.backgroundColor = 'red';
|
|
|
+ };
|
|
|
+
|
|
|
+
|
|
|
+ document.getElementById('size').onclick = function() {
|
|
|
+ document.body.children[1].style.width='400px';
|
|
|
+ document.body.children[1].style.height='400px';
|
|
|
+ document.body.children[1].style.backgroundColor='blue';
|
|
|
+ };
|
|
|
+
|
|
|
+
|
|
|
+ document.getElementById('back').onclick = function() {
|
|
|
+ var elems = document.querySelector('p');
|
|
|
+ elems.innerHTML="ЗАМЕНА ТЕКСТА";
|
|
|
+
|
|
|
+ };
|
|
|
+
|
|
|
+
|
|
|
+//*objectSplit (1)__________________________________________________________________________________________________________
|
|
|
+
|
|
|
+ var obj = { foo: 1,
|
|
|
+ bar: null,
|
|
|
+ baz: undefined
|
|
|
+};
|
|
|
+var arr=[];
|
|
|
+var mass=[];
|
|
|
+
|
|
|
+function alertik1(x){
|
|
|
+ x.keys;
|
|
|
+ x.values;
|
|
|
+for(var props in x){
|
|
|
+ arr.push(props);
|
|
|
+ if(x[props]===null){
|
|
|
+ mass.push("null"); continue;
|
|
|
+ }
|
|
|
+ else if(x[props]===undefined){
|
|
|
+ mass.push("undefined"); break;
|
|
|
+ }
|
|
|
+ mass.push(x[props]);
|
|
|
+ }
|
|
|
+ x.keys=arr;
|
|
|
+ x.values=mass;
|
|
|
+
|
|
|
+
|
|
|
+document.write(x.keys+"</br>"+x.values);
|
|
|
+
|
|
|
+};
|
|
|
+alertik1(obj);
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+//*objectToPairs (1)____________________________________________________________________________________________________
|
|
|
+var mass=[];
|
|
|
+var obj = { foo: 1,
|
|
|
+ bar: null,
|
|
|
+ baz: undefined
|
|
|
+};
|
|
|
+function alertik(x){
|
|
|
+for(var props in x){
|
|
|
+ mass.push(props);
|
|
|
+ if(x[props]===null){
|
|
|
+ mass.push("null"); continue;
|
|
|
+ }
|
|
|
+ else if(x[props]===undefined){
|
|
|
+ mass.push("undefined"); break;
|
|
|
+ }
|
|
|
+ mass.push(x[props]);
|
|
|
+}
|
|
|
+alert(mass);
|
|
|
+};
|
|
|
+
|
|
|
+alertik(obj);*/
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ /*Table 4 (только начато)____________________________________________________________________________________________________
|
|
|
+ document.querySelector('button').onclick=function colorik(){
|
|
|
+ var pinp = document.createElement('input');
|
|
|
+ pinp.className = "inpnumber1";
|
|
|
+ document.body.children[2].appendChild(pinp);
|
|
|
+
|
|
|
+ };*/
|
|
|
+
|
|
|
+ </script>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </body>
|
|
|
+</html>
|
