index.html 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title></title>
  6. </head>
  7. <body>
  8. <div id="container"></div>
  9. <script>
  10. //----------3 persons --- different fields --- fields check
  11. /*let a={
  12. name:'John',
  13. surname:'Johnson'
  14. };
  15. let b={
  16. name:"Ivan",
  17. surname:"Ivanov"
  18. };
  19. let c={
  20. name:'Kevin',
  21. surname:"McKalister"
  22. };
  23. a.sex='man';
  24. a.age=17;
  25. b.fathername='Jonson';
  26. c.age=19;
  27. let key =prompt('','');
  28. if(key in a){
  29. alert(a[key]);
  30. }*/
  31. //----------array of persons
  32. /* let a={
  33. name:'John',
  34. surname:'Johnson'
  35. };
  36. let b={
  37. name:"Ivan",
  38. surname:"Ivanov"
  39. };
  40. let c={
  41. name:'Kevin',
  42. surname:"McKalister"
  43. };
  44. let persons=[a,b,c];
  45. persons.push({name:"Frank", surname:'Lampard'});
  46. //loop of persons
  47. for(let item of persons){
  48. console.log(item);
  49. }
  50. //loop of name and surname
  51. for(let item of persons){
  52. console.log(item.name+" "+item.surname);
  53. }
  54. //loop of loop of values
  55. for(let item of persons){
  56. for(let name of Object.values(item)){
  57. console.log(name);
  58. }
  59. }
  60. //fullName
  61. for(let item of persons){
  62. item.fullName=item.name+" "+item.surname;
  63. console.log(item.fullName);
  64. }
  65. console.log(persons);
  66. //serialize
  67. let json=JSON.stringify(persons,null,2);
  68. console.log(json);
  69. //deserialize
  70. let d=JSON.parse(json)[0];
  71. console.log(d);
  72. persons.push(d);
  73. console.log(persons);*/
  74. //----------HTML
  75. /*let str = "<table border='1'><tr><td>Имя</td><td>Фамилия</td></tr>";
  76. for (let i=0;i<persons.length;i++){
  77. let g=persons[i];
  78. str += `<tr><td>${g.name}</td><td>${g.surname}</td></tr>`;
  79. }
  80. str += "</table>";
  81. document.write(str);*/
  82. //----------HTML optional fields --- HTML tr color
  83. /*
  84. let str = "<table border='1'>";
  85. for (let i=0;i<persons.length;i++){
  86. let g=persons[i];
  87. if(i%2){
  88. str+="<tr bgcolor='yellow'>";
  89. }else{
  90. str+='<tr>';
  91. }
  92. for(let item in g){
  93. if(item){
  94. str+=`<td>${item}: ${g[item]}</td>`;
  95. }
  96. }
  97. str+='</tr>';
  98. }
  99. str += "</table>";
  100. document.write(str);*/
  101. //---------HTML th optional
  102. /*persons[2].age=19;
  103. persons[3].age=27;
  104. persons[3].sex='man';
  105. let keys=[];
  106. for(let item of persons){
  107. for(let i of Object.keys(item)){
  108. if(!keys.includes(i)){
  109. keys.push(i);
  110. }
  111. }
  112. }
  113. console.log(keys);
  114. let str = "<table border='1'><tr>";
  115. for(let i of keys){
  116. str+=`<th>${i}</th>`;
  117. }
  118. str+='</tr>';
  119. for(let item of persons){
  120. str+='<tr>';
  121. for(let it in item){
  122. for(let i=0;i<keys.length;i++){
  123. if(keys[i]==it){
  124. str+=`<td bgcolor='yellow'>${item[it]}</td>`;
  125. }
  126. }
  127. }
  128. str+='</tr>';
  129. }
  130. document.write(str);*/
  131. //----------Blue belt
  132. //появляется ячейка table -> {tbody}? -> tr -> td
  133. var someTree = {
  134. tagName: "table",
  135. subTags: [
  136. {
  137. tagName: "tr",
  138. subTags: [
  139. {
  140. tagName: "td",
  141. text: "some text",
  142. },
  143. {
  144. tagName: "td",
  145. text: "some text 2",
  146. }
  147. ]
  148. }
  149. ],
  150. attrs: {
  151. border: 1,
  152. },
  153. }
  154. let str='';
  155. for(let item in someTree){
  156. if(item=='tagName'){
  157. let [key] = Object.keys(someTree['attrs']);
  158. let [value]= Object.values(someTree['attrs']);
  159. str+=`<${someTree['tagName']} ${key}=${value}>`;
  160. }
  161. if(item=='subTags'){
  162. for(let item2 of someTree[item]){
  163. for(let item3 in item2){
  164. // str+=`<${item2['tagName']}>`;
  165. if(item3=='subTags'){
  166. for(let item4 of item2['subTags']){
  167. console.log(item4);
  168. for(let item5 in item4){
  169. if(item5=='tagName'){
  170. str+=`<${item4['tagName']}>${item4['text']}</${item4['tagName']}>`;
  171. }
  172. }
  173. }
  174. }
  175. }
  176. }
  177. }
  178. }
  179. document.write(str);
  180. //------destruct array
  181. //четные числав переменные even1, even2
  182. /*let arr=[1,2,3,4,5,'a','b','c'];
  183. for(let i=0; i<arr.length; i++) {
  184. for(let j=0; j<arr.length; j++ ){
  185. if(arr[j]%2 === 1){
  186. arr.splice(j,1)
  187. break;
  188. }
  189. }
  190. };
  191. let [even1,even2]=arr;
  192. console.log(arr);
  193. console.log(even1+" : "+even2); */
  194. //нечетные в odd1, odd2, odd3
  195. /*let arr2=[1,2,3,4,5,'a','b','c'];
  196. let [odd1,odd2,odd3]=arr2.filter(x=>x%2);
  197. console.log(odd1+" : "+odd2+' : '+odd3);*/
  198. //буквы в отдельный массив
  199. /*let arr3=arr2.filter(function(x){
  200. if(!Number(x)){
  201. return x;
  202. }
  203. });
  204. console.log(arr3);*/
  205. //------destruct string
  206. //число в переменную number
  207. /*let arr=[1,'abc'];
  208. let [number]=arr;
  209. console.log(number);*/
  210. //букву а в переменную s1
  211. //букву b в переменную s2
  212. //букву с в переменную s3
  213. /*let [s1,s2,s3]=[...arr[1]];
  214. console.log(s1+" : "+s2+" : "+s3);*/
  215. //------destruct 2
  216. /*let obj = {
  217. name: 'Ivan',
  218. surname: 'Petrov',
  219. children: [
  220. {
  221. name: 'Maria'
  222. },
  223. {
  224. name: 'Nikolay'
  225. }
  226. ]
  227. };
  228. let {children:[{name:name1},{name:name2}]}=obj;
  229. console.log(name1 + " : "+name2);*/
  230. //------destruct 3
  231. /*let arr = [1,2,3,4,5,6,7,10];
  232. let [a,b]=arr;
  233. let {length}=arr;
  234. console.log(a+' : '+b+' : '+length);*/
  235. //------Black belt
  236. //in process
  237. </script>
  238. </body>
  239. </html>