index.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132
  1. // Required Task 1
  2. // Завершите код функции typeMessage так, чтобы на страницу выводился один символ в секунду
  3. function typeMessage ( message, velocity ) {
  4. var container = document.getElementById ( "demo" ) ?
  5. document.getElementById ( "demo" ) :
  6. document.body.appendChild (
  7. document.createElement ( "h3" )
  8. )
  9. container.style = `color: magenta;`
  10. var index = 0
  11. return (function() {
  12. var timerId = setTimeout(function showMessage() {
  13. setTimeout(showMessage, velocity * 1000);
  14. index++;
  15. if(index > message.length)
  16. {null} else
  17. {
  18. container.innerText = message.substring(0, index);
  19. }
  20. });
  21. })()
  22. }
  23. typeMessage ( `Welcome to the hell`, 1 )
  24. // Additionally Task 2
  25. // Напилите код методов setUserPresent, showPresent и showAbsent
  26. // var users = (
  27. // function ( list ) {
  28. // var users = []
  29. // for ( var user of list )
  30. // users.push ({
  31. // name: user,
  32. // present: false
  33. // })
  34. // return {
  35. // setUserPresent ( userName, present ) {
  36. // ...
  37. // },
  38. // showPresent () {
  39. // ...
  40. // },
  41. // showAbsent () {
  42. // ...
  43. // }
  44. // }
  45. // }
  46. // )( [ "Иван", "Дмитрий", "Степан", "Михаил" ] )
  47. // users.showAbsent()
  48. // После запуска кода результат в консоли должен быть таким:
  49. // Иван
  50. // Дмитрий
  51. // Степан
  52. // Михаил
  53. // а после выполнения кода:
  54. // users.setUserPresent( "Иван", "+" )
  55. // users.setUserPresent( "Михаил", "присутствовал" )
  56. // users.setUserPresent( "Степан", true )
  57. // users.showPresent()
  58. // результат в консоли должен быть таким:
  59. // Иван
  60. // Степан
  61. // Михаил
  62. var users = (
  63. function ( list ) {
  64. var users = []
  65. for ( var user of list )
  66. users.push ({
  67. name: user,
  68. present: false
  69. })
  70. return {
  71. setUserPresent ( userName, present ) {
  72. for (var user of users) {
  73. userName === user.name && (present === '+' || "присутствовал" || present === true) ? user.present = true : null;
  74. }
  75. },
  76. showPresent () {
  77. for (var user of users) {
  78. user.present === true ?console.log(user.name) : null;
  79. }
  80. },
  81. showAbsent () {
  82. for (var user of users) {
  83. user.present === false ? console.log(user.name) : null;
  84. }
  85. }
  86. }
  87. }
  88. )( [ "Иван", "Дмитрий", "Степан", "Михаил" ] )
  89. users.showAbsent()
  90. users.setUserPresent( "Иван", "+" )
  91. users.setUserPresent( "Михаил", "присутствовал" )
  92. users.setUserPresent( "Степан", true )
  93. users.showPresent()
  94. // Additionally Task 3
  95. // Допилите код функции changeClass, которая парсит все стили страницы в поисках заданного класса, а затем меняет атрибуты стиля этого класса
  96. // let changeClass = ( classname, styleString ) => (
  97. // ...
  98. // ).length > 0 ? console.log ( "found" ) :
  99. // document.head.appendChild (
  100. // document.createElement ( "style" )
  101. // ).textContent = `.${classname} {${styleString}}`
  102. // После вызова функции:
  103. // changeClass ( "second-level-menu", "background-color: red!important;" )
  104. // в консоли страницы, где есть элементы с классом second-level-menu, у всех элементов этого класса цвет фона должен измениться на красный
  105. let changeClass = ( classname, styleString ) => ( Array.from ( document.styleSheets )
  106. .filter ( sheet => !sheet.href )
  107. .map (
  108. sheet => Array.from ( sheet.cssRules )
  109. .filter ( rule => rule.selectorText === `.{classname}` )
  110. )
  111. .filter ( item => item.length > 0 )
  112. .map ( item => item[0].cssText.split ("}")
  113. .join ( `${styleString}}` )
  114. )
  115. ).length > 0 ? console.log ( "found" ) :
  116. document.head.appendChild (
  117. document.createElement ( "style" )
  118. ).textContent = `.${classname} {${styleString}}`
  119. changeClass ( "second-level-menu", "background-color: red!important;" )