БоврСмСнная Ρ€Π°Π±ΠΎΡ‚Π° с ΠΏΠ»Π°Ρ‚Ρ„ΠΎΡ€ΠΌΠΎΠΉ 1Π‘:ΠŸΡ€Π΅Π΄ΠΏΡ€ΠΈΡΡ‚ΠΈΠ΅ 8.3 Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ Π½Π΅ просто Π²Π²ΠΎΠ΄Π° ΠΏΠ΅Ρ€Π²ΠΈΡ‡Π½Ρ‹Ρ… Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ΠΎΠ², Π½ΠΎ ΠΈ ΠΎΠΏΠ΅Ρ€Π°Ρ‚ΠΈΠ²Π½ΠΎΠ³ΠΎ контроля ΠΊΠ»ΡŽΡ‡Π΅Π²Ρ‹Ρ… ΠΏΠΎΠΊΠ°Π·Π°Ρ‚Π΅Π»Π΅ΠΉ бизнСса. Π‘Ρ‚Π°Π½Π΄Π°Ρ€Ρ‚Π½Ρ‹Π΅ ΠΎΡ‚Ρ‡Π΅Ρ‚Ρ‹ часто ΠΏΠ΅Ρ€Π΅Π³Ρ€ΡƒΠΆΠ΅Π½Ρ‹ дСталями, Ρ‚ΠΎΠ³Π΄Π° ΠΊΠ°ΠΊ Ρ€ΡƒΠΊΠΎΠ²ΠΎΠ΄ΠΈΡ‚Π΅Π»ΡŽ ΠΈΠ»ΠΈ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€Ρƒ Π½ΡƒΠΆΠ½Π° мгновСнная визуализация состояния Π΄Π΅Π». ИмСнно для этих Ρ†Π΅Π»Π΅ΠΉ ΠΈ слуТат Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹ 1Π‘, ΠΏΡ€Π΅Π΄ΡΡ‚Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ собой ΠΊΠΎΠΌΠΏΠ°ΠΊΡ‚Π½Ρ‹Π΅ элСмСнты интСрфСйса, выводящиС критичСски Π²Π°ΠΆΠ½ΡƒΡŽ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ.

Π Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠ° собствСнных Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ΠΎΠ² ΠΎΡ‚ΠΊΡ€Ρ‹Π²Π°Π΅Ρ‚ ΡˆΠΈΡ€ΠΎΠΊΠΈΠ΅ возмоТности для кастомизации Ρ€Π°Π±ΠΎΡ‡Π΅Π³ΠΎ мСста ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Ρ. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΎΡ‚ΠΎΠ±Ρ€Π°Π·ΠΈΡ‚ΡŒ Π³Ρ€Π°Ρ„ΠΈΠΊ ΠΏΡ€ΠΎΠ΄Π°ΠΆ Π·Π° Ρ‚Π΅ΠΊΡƒΡ‰ΠΈΠΉ час, список горящих Π·Π°ΠΊΠ°Π·ΠΎΠ² ΠΈΠ»ΠΈ остаток Π΄Π΅Π½Π΅ΠΆΠ½Ρ‹Ρ… срСдств Π½Π° расчСтном счСтС прямо Π½Π° стартовой страницС. Для Ρ€Π΅Π°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ этой Π·Π°Π΄Π°Ρ‡ΠΈ программисту Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ Π²Π»Π°Π΄Π΅Ρ‚ΡŒ Π½Π°Π²Ρ‹ΠΊΠ°ΠΌΠΈ Ρ€Π°Π±ΠΎΡ‚Ρ‹ с ΠΌΠ°ΠΊΠ΅Ρ‚Π°ΠΌΠΈ, HTML ΠΈ встроСнным языком ΠΏΠ»Π°Ρ‚Ρ„ΠΎΡ€ΠΌΡ‹.

ΠŸΡ€ΠΎΡ†Π΅ΡΡ создания Π½Π΅ Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΡ Π²Π½Π΅ΡˆΠ½ΠΈΡ… Π²Π΅Π±-сСрвСров, Ρ‚Π°ΠΊ ΠΊΠ°ΠΊ всС вычислСния происходят Π²Π½ΡƒΡ‚Ρ€ΠΈ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΎΠ½Π½ΠΎΠΉ Π±Π°Π·Ρ‹. Однако Π²Π°ΠΆΠ½ΠΎ ΠΏΠΎΠ½ΠΈΠΌΠ°Ρ‚ΡŒ Π°Ρ€Ρ…ΠΈΡ‚Π΅ΠΊΡ‚ΡƒΡ€Π½Ρ‹Π΅ ограничСния: Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π±Ρ‹Ρ‚ΡŒ максимально лСгковСсными, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ Π·Π°ΠΌΠ΅Π΄Π»ΡΡ‚ΡŒ Ρ€Π°Π±ΠΎΡ‚Ρƒ всСго прилоТСния. Π’ этой ΡΡ‚Π°Ρ‚ΡŒΠ΅ ΠΌΡ‹ ΠΏΠΎΠ΄Ρ€ΠΎΠ±Π½ΠΎ Ρ€Π°Π·Π±Π΅Ρ€Π΅ΠΌ Π°Π»Π³ΠΎΡ€ΠΈΡ‚ΠΌ дСйствий ΠΎΡ‚ проСктирования Ρ„ΠΎΡ€ΠΌΡ‹ Π΄ΠΎ Ρ„ΠΈΠ½Π°Π»ΡŒΠ½ΠΎΠΉ ΠΎΡ‚Π»Π°Π΄ΠΊΠΈ ΠΊΠΎΠ΄Π°.

ΠŸΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠ° Π΄Π°Π½Π½Ρ‹Ρ… ΠΈ Π²Ρ‹Π±ΠΎΡ€ Ρ‚ΠΈΠΏΠ° отобраТСния

ΠŸΠ΅Ρ€Π΅Π΄ Ρ‚Π΅ΠΌ ΠΊΠ°ΠΊ ΠΏΡ€ΠΈΡΡ‚ΡƒΠΏΠΈΡ‚ΡŒ ΠΊ написанию ΠΊΠΎΠ΄Π°, Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ Ρ‡Π΅Ρ‚ΠΊΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ, ΠΊΠ°ΠΊΡƒΡŽ ΠΈΠΌΠ΅Π½Π½ΠΎ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ Π±ΡƒΠ΄Π΅Ρ‚ ΡΠΎΠ΄Π΅Ρ€ΠΆΠ°Ρ‚ΡŒ ваш Π±ΡƒΠ΄ΡƒΡ‰ΠΈΠΉ элСмСнт интСрфСйса. Π§Π°Ρ‰Π΅ всСго для Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ΠΎΠ² ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ Π΄Π°Π½Π½Ρ‹Π΅ ΠΈΠ· рСгистров накоплСния ΠΈΠ»ΠΈ ΠΎΠΏΠ΅Ρ€Π°Ρ‚ΠΈΠ²Π½Ρ‹Π΅ ΠΈΡ‚ΠΎΠ³ΠΈ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ΠΎΠ². Запрос Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ ΠΎΠΏΡ‚ΠΈΠΌΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Π½, Ρ‚Π°ΠΊ ΠΊΠ°ΠΊ ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡ‚ΡŒΡΡ ΠΏΡ€ΠΈ ΠΊΠ°ΠΆΠ΄ΠΎΠΌ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠΈ экрана.

БущСствуСт нСсколько ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ΠΎΠ² ΠΊ Π²ΠΈΠ·ΡƒΠ°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ стандартныС элСмСнты Ρ„ΠΎΡ€ΠΌΡ‹ 1Π‘, Ρ‚Π°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ Π΄ΠΈΠ°Π³Ρ€Π°ΠΌΠΌΡ‹ ΠΈΠ»ΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Π½ΠΎ ΠΎΠ½ΠΈ часто выглядят Π³Ρ€ΠΎΠΌΠΎΠ·Π΄ΠΊΠΎ. Π‘ΠΎΠ»Π΅Π΅ ΠΏΡ€ΠΎΠ΄Π²ΠΈΠ½ΡƒΡ‚Ρ‹ΠΉ ΠΌΠ΅Ρ‚ΠΎΠ΄ β€” гСнСрация HTML-Ρ€Π°Π·ΠΌΠ΅Ρ‚ΠΊΠΈ прямо Π² ΠΊΠΎΠ΄Π΅ 1Π‘ ΠΈ Π²Ρ‹Π²ΠΎΠ΄ Π΅Ρ‘ Π² ΠΏΠΎΠ»Π΅ Ρ‚ΠΈΠΏΠ° "HTML-Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚". Π­Ρ‚ΠΎ позволяСт ΠΏΡ€ΠΈΠΌΠ΅Π½ΡΡ‚ΡŒ CSS-стили ΠΈ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΡƒΠ½ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½.

πŸ“Š Какой Ρ‚ΠΈΠΏ Π΄Π°Π½Π½Ρ‹Ρ… Π²Ρ‹ ΠΏΠ»Π°Π½ΠΈΡ€ΡƒΠ΅Ρ‚Π΅ Π²Ρ‹Π²ΠΎΠ΄ΠΈΡ‚ΡŒ Π² Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π΅?
ВСкстовыС ΠΏΠΎΠΊΠ°Π·Π°Ρ‚Π΅Π»ΠΈ (KPI)
Π“Ρ€Π°Ρ„ΠΈΠΊΠΈ ΠΈ Π΄ΠΈΠ°Π³Ρ€Π°ΠΌΠΌΡ‹
Бписки Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ΠΎΠ²
ΠšΠΎΠΌΠ±ΠΈΠ½ΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹ΠΉ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚

ΠŸΡ€ΠΈ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠΈ структуры Π΄Π°Π½Π½Ρ‹Ρ… стоит ΠΈΠ·Π±Π΅Π³Π°Ρ‚ΡŒ Π²Ρ‹Π±ΠΎΡ€ΠΊΠΈ Π±ΠΎΠ»ΡŒΡˆΠΈΡ… объСмов записСй "Π² Π»ΠΎΠ±". Π›ΡƒΡ‡ΡˆΠ΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π²Ρ€Π΅ΠΌΠ΅Π½Π½Ρ‹Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΈΠ»ΠΈ сводныС Π΄Π°Π½Π½Ρ‹Π΅. Если Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒ Π΄ΠΈΠ½Π°ΠΌΠΈΠΊΡƒ, ΡƒΠ±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ ΠΏΠ΅Ρ€ΠΈΠΎΠ΄ Π²Ρ‹Π±ΠΎΡ€ΠΊΠΈ ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½ Ρ€Π°Π·ΡƒΠΌΠ½Ρ‹ΠΌΠΈ ΠΏΡ€Π΅Π΄Π΅Π»Π°ΠΌΠΈ, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, Ρ‚Π΅ΠΊΡƒΡ‰ΠΈΠΌ мСсяцСм ΠΈΠ»ΠΈ ΠΊΠ²Π°Ρ€Ρ‚Π°Π»ΠΎΠΌ.

πŸ’‘

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΈΠ½Π΄Π΅ΠΊΡΠ°Ρ†ΠΈΡŽ ΠΏΠΎΠ»Π΅ΠΉ Π² запросах ΠΊ рСгистрам накоплСния, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±ΠΎΡ€ΠΊΠ° Π΄Π°Π½Π½Ρ‹Ρ… для Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π° Π·Π°Π½ΠΈΠΌΠ°Π»Π° миллисСкунды, Π° Π½Π΅ сСкунды.

Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Ρ„ΠΎΡ€ΠΌΡ‹ ΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠ΅ элСмСнтов управлСния

ВСхничСски Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ Π² 1Π‘ рСализуСтся ΠΊΠ°ΠΊ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Π°Ρ Ρ„ΠΎΡ€ΠΌΠ° ΠΈΠ»ΠΈ ΠΊΠ°ΠΊ Ρ‡Π°ΡΡ‚ΡŒ Ρ„ΠΎΡ€ΠΌΡ‹ Ρ€Π°Π±ΠΎΡ‡Π΅Π³ΠΎ мСста ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€Π° (РММ). Для Π½Π°Ρ‡Π°Π»Π° создайтС Π½ΠΎΠ²ΡƒΡŽ Ρ„ΠΎΡ€ΠΌΡƒ Π² ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ‚ΠΎΡ€Π΅. Π’ ΠΏΠ°Π»ΠΈΡ‚Ρ€Π΅ свойств ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ установитС свойство Π’ΠΈΠΏ Ρ„ΠΎΡ€ΠΌΡ‹ Π² Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ ΠžΠ±Ρ‹Ρ‡Π½Π°Ρ Ρ„ΠΎΡ€ΠΌΠ°, Ссли Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΌΠ°ΠΊΡΠΈΠΌΠ°Π»ΡŒΠ½ΡƒΡŽ Π³ΠΈΠ±ΠΊΠΎΡΡ‚ΡŒ Π² располоТСнии элСмСнтов.

ΠžΡΠ½ΠΎΠ²Π½Ρ‹ΠΌ ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€ΠΎΠΌ для нашСго ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° станСт ΠΏΠΎΠ»Π΅ Ρ‚ΠΈΠΏΠ° HTML-Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΅Π³ΠΎ Π½Π° Ρ„ΠΎΡ€ΠΌΡƒ ΠΈ растянитС Π΄ΠΎ Π½ΡƒΠΆΠ½Ρ‹Ρ… Ρ€Π°Π·ΠΌΠ΅Ρ€ΠΎΠ². ИмСнно Π² это ΠΏΠΎΠ»Π΅ ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ½ΠΎ Π·Π°Π³Ρ€ΡƒΠΆΠ°Ρ‚ΡŒ ΡΠ³Π΅Π½Π΅Ρ€ΠΈΡ€ΠΎΠ²Π°Π½Π½ΡƒΡŽ строку с HTML-ΠΊΠΎΠ΄ΠΎΠΌ. Π’Π°ΠΊΠΆΠ΅ Π½Π° Ρ„ΠΎΡ€ΠΌΡƒ стоит Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊΠ½ΠΎΠΏΠΊΡƒ "ΠžΠ±Π½ΠΎΠ²ΠΈΡ‚ΡŒ", Ссли автоматичСскоС ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ Π½Π΅ прСдусмотрСно Π»ΠΎΠ³ΠΈΠΊΠΎΠΉ Ρ€Π°Π±ΠΎΡ‚Ρ‹.

Π’Π°ΠΆΠ½ΠΎ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ Π½Π°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ Ρ€Π΅ΠΊΠ²ΠΈΠ·ΠΈΡ‚Ρ‹ Ρ„ΠΎΡ€ΠΌΡ‹. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Ρ€Π΅ΠΊΠ²ΠΈΠ·ΠΈΡ‚ Ρ‚ΠΈΠΏΠ° Π‘Ρ‚Ρ€ΠΎΠΊΠ° Π½Π΅ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½Π½ΠΎΠΉ Π΄Π»ΠΈΠ½Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±ΡƒΠ΄Π΅Ρ‚ Ρ…Ρ€Π°Π½ΠΈΡ‚ΡŒ HTML-ΠΊΠΎΠ΄. ΠŸΡ€ΠΈΠ²ΡΠΆΠΈΡ‚Π΅ этот Ρ€Π΅ΠΊΠ²ΠΈΠ·ΠΈΡ‚ ΠΊ созданному полю Π½Π° Ρ„ΠΎΡ€ΠΌΠ΅. Π­Ρ‚ΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ‚ Ρ€Π°Π·Π΄Π΅Π»ΡΡ‚ΡŒ Π»ΠΎΠ³ΠΈΠΊΡƒ формирования Π΄Π°Π½Π½Ρ‹Ρ… ΠΈ ΠΈΡ… ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎ упростит ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΊΡƒ ΠΊΠΎΠ΄Π° Π² Π±ΡƒΠ΄ΡƒΡ‰Π΅ΠΌ.

β˜‘οΈ ΠŸΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠ° Ρ„ΠΎΡ€ΠΌΡ‹ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π°

Π’Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΎ: 0 / 5
⚠️ Π’Π½ΠΈΠΌΠ°Π½ΠΈΠ΅: ПолС HTML-Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π° ΠΈΠΌΠ΅Π΅Ρ‚ ограничСния ΠΏΠΎ бСзопасности. Π‘Ρ€Π°ΡƒΠ·Π΅Ρ€Π½Ρ‹ΠΉ Π΄Π²ΠΈΠΆΠΎΠΊ 1Π‘ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Π»ΠΎΠΊΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ JavaScript-скриптов Π²Π½ΡƒΡ‚Ρ€ΠΈ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π°, поэтому вся ΠΈΠ½Ρ‚Π΅Ρ€Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΡΡ‚ΡŒ Π΄ΠΎΠ»ΠΆΠ½Π° Ρ€Π΅Π°Π»ΠΈΠ·ΠΎΠ²Ρ‹Π²Π°Ρ‚ΡŒΡΡ Ρ‡Π΅Ρ€Π΅Π· события Ρ„ΠΎΡ€ΠΌΡ‹ 1Π‘, Π° Π½Π΅ Ρ‡Π΅Ρ€Π΅Π· JS.

ГСнСрация HTML-Ρ€Π°Π·ΠΌΠ΅Ρ‚ΠΊΠΈ Π²ΠΎ встроСнном языкС

Π‘Π΅Ρ€Π΄Ρ†Π΅ΠΌ вашСго Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π° являСтся ΠΏΡ€ΠΎΡ†Π΅Π΄ΡƒΡ€Π°, Ρ„ΠΎΡ€ΠΌΠΈΡ€ΡƒΡŽΡ‰Π°Ρ содСрТимоС. Π’ ΠΌΠΎΠ΄ΡƒΠ»Π΅ Ρ„ΠΎΡ€ΠΌΡ‹ создайтС Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ, которая Π²ΠΎΠ·Π²Ρ€Π°Ρ‰Π°Π΅Ρ‚ строку. Π’Π½ΡƒΡ‚Ρ€ΠΈ этой Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΊΠΎΠ½ΠΊΠ°Ρ‚Π΅Π½Π°Ρ†ΠΈΡŽ строк для сборки HTML-Ρ‚Π΅Π³ΠΎΠ². НС Π·Π°Π±ΡƒΠ΄ΡŒΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π±Π°Π·ΠΎΠ²Ρ‹Π΅ стили CSS прямо Π² Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ style Ρ‚Π΅Π³ΠΎΠ², Ρ‚Π°ΠΊ ΠΊΠ°ΠΊ внСшниС Ρ„Π°ΠΉΠ»Ρ‹ ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡Π°Ρ‚ΡŒ Π½Π΅ΡƒΠ΄ΠΎΠ±Π½ΠΎ.

Для стилизации ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΈΠ½Π»Π°ΠΉΠ½ΠΎΠ²Ρ‹Π΅ стили. НапримСр, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΊΠ°Ρ€Ρ‚ΠΎΡ‡ΠΊΡƒ с ΠΏΠΎΠΊΠ°Π·Π°Ρ‚Π΅Π»Π΅ΠΌ, ΠΎΠ±Π΅Ρ€Π½ΠΈΡ‚Π΅ Π΄Π°Π½Π½Ρ‹Π΅ Π² div с Π·Π°Π΄Π°Π½Π½Ρ‹ΠΌ Ρ„ΠΎΠ½ΠΎΠΌ ΠΈ скруглСниСм ΡƒΠ³Π»ΠΎΠ². Π¦Π²Π΅Ρ‚Π° Π»ΡƒΡ‡ΡˆΠ΅ Π²Ρ‹Π±ΠΈΡ€Π°Ρ‚ΡŒ ΠΈΠ· ΠΊΠΎΡ€ΠΏΠΎΡ€Π°Ρ‚ΠΈΠ²Π½ΠΎΠΉ ΠΏΠ°Π»ΠΈΡ‚Ρ€Ρ‹ ΠΈΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ стандартныС Ρ†Π²Π΅Ρ‚Π° статусов (Π·Π΅Π»Π΅Π½Ρ‹ΠΉ для ΠΏΡ€ΠΈΠ±Ρ‹Π»ΠΈ, красный для ΡƒΠ±Ρ‹Ρ‚ΠΊΠ°).

Ѐункция Π‘Ρ„ΠΎΡ€ΠΌΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒHTML()

ВСкстHTML = "";

ВСкстHTML = ВСкстHTML + "";

ВСкстHTML = ВСкстHTML + "

ΠŸΡ€ΠΎΠ΄Π°ΠΆΠΈ Π·Π° сСгодня

";

ВСкстHTML = ВСкстHTML + "";

ВСкстHTML = ВСкстHTML + Π€ΠΎΡ€ΠΌΠ°Ρ‚(Π‘ΡƒΠΌΠΌΠ°ΠŸΡ€ΠΎΠ΄Π°ΠΆ, "Π§Π“=") + "";

ВСкстHTML = ВСкстHTML + "";

Π’ΠΎΠ·Π²Ρ€Π°Ρ‚ ВСкстHTML;

ΠšΠΎΠ½Π΅Ρ†Π€ΡƒΠ½ΠΊΡ†ΠΈΠΈ

ΠŸΡ€ΠΈ Ρ€Π°Π±ΠΎΡ‚Π΅ с тСкстом Π²Π°ΠΆΠ½ΠΎ ΡΠΊΡ€Π°Π½ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΡΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹Π΅ символы, Ссли ΠΎΠ½ΠΈ ΠΌΠΎΠ³ΡƒΡ‚ ΠΏΠΎΠΏΠ°ΡΡ‚ΡŒ Π² Π²Ρ‹Π²ΠΎΠ΄ ΠΈΠ· Π±Π°Π·Ρ‹ Π΄Π°Π½Π½Ρ‹Ρ…. Π₯отя ΠΏΠ»Π°Ρ‚Ρ„ΠΎΡ€ΠΌΠ° 1Π‘ Π΄Π΅Π»Π°Π΅Ρ‚ это автоматичСски ΠΏΡ€ΠΈ присваивании значСния полю, ΠΏΡ€ΠΈ Ρ€ΡƒΡ‡Π½ΠΎΠΉ сборкС строк стоит Π±Ρ‹Ρ‚ΡŒ Π²Π½ΠΈΠΌΠ°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΌ ΠΊ ΠΊΠ°Π²Ρ‹Ρ‡ΠΊΠ°ΠΌ Π²Π½ΡƒΡ‚Ρ€ΠΈ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ΠΎΠ² HTML.

ΠŸΠΎΡ‡Π΅ΠΌΡƒ Π½Π΅ стоит ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ внСшниС CSS Ρ„Π°ΠΉΠ»Ρ‹?

ΠŸΠΎΠ΄ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΠ΅ Π²Π½Π΅ΡˆΠ½ΠΈΡ… стилСй услоТняСт Π΄Π΅ΠΏΠ»ΠΎΠΉ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΠΈ. ΠŸΡ€ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠΈ Π±Π°Π·Ρ‹ Π½Π° Π΄Ρ€ΡƒΠ³ΠΎΠΌ ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€Π΅ ΠΈΠ»ΠΈ сСрвСрС ΠΏΡƒΡ‚ΠΈ ΠΊ Ρ„Π°ΠΉΠ»Π°ΠΌ ΠΌΠΎΠ³ΡƒΡ‚ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒΡΡ, ΠΈ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ потСряСт ΠΎΡ„ΠΎΡ€ΠΌΠ»Π΅Π½ΠΈΠ΅. Π˜Π½Π»Π°ΠΉΠ½ΠΎΠ²Ρ‹Π΅ стили Π³Π°Ρ€Π°Π½Ρ‚ΠΈΡ€ΡƒΡŽΡ‚ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ Π²ΠΈΠ΄ Π²Π΅Π·Π΄Π΅.

Настройка событий ΠΈ интСрактивности

Бтатичная ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° ΠΏΠΎΠ»Π΅Π·Π½Π°, Π½ΠΎ настоящий Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ Π΄ΠΎΠ»ΠΆΠ΅Π½ Ρ€Π΅Π°Π³ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π½Π° дСйствия ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Ρ. Π’ 1Π‘ это рСализуСтся Ρ‡Π΅Ρ€Π΅Π· события Ρ„ΠΎΡ€ΠΌΡ‹. НапримСр, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ‚Π°ΠΊ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈ ΠΊΠ»ΠΈΠΊΠ΅ Π½Π° элСмСнт HTML происходило ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΠΈΠ΅ ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½ΠΎΠ³ΠΎ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π° ΠΈΠ»ΠΈ ΠΎΡ‚Ρ‡Π΅Ρ‚Π°.

Для этого Π² HTML-ΠΊΠΎΠ΄Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ‚Π΅Π³ <a> ΠΈΠ»ΠΈ <div> с ΡΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹ΠΌ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ΠΎΠΌ href ΠΈΠ»ΠΈ ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΎΠΌ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ 1Π‘ ΡƒΠΌΠ΅Π΅Ρ‚ ΠΏΠ΅Ρ€Π΅Ρ…Π²Π°Ρ‚Ρ‹Π²Π°Ρ‚ΡŒ. Однако Π±ΠΎΠ»Π΅Π΅ Π½Π°Π΄Π΅ΠΆΠ½Ρ‹ΠΉ способ β€” использованиС событий ΠΌΡ‹ΡˆΠΈ Π² самой Ρ„ΠΎΡ€ΠΌΠ΅. Если Π²Ρ‹ Π²Ρ‹Π²ΠΎΠ΄ΠΈΡ‚Π΅ список, ΠΊΠ»ΠΈΠΊ ΠΏΠΎ строкС списка ΠΌΠΎΠΆΠ΅Ρ‚ ΠΎΠ±Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Ρ‚ΡŒΡΡ стандартными срСдствами ΠΏΠ»Π°Ρ‚Ρ„ΠΎΡ€ΠΌΡ‹.

Рассмотрим ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Ρ€Π΅Π°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΏΠ΅Ρ€Π΅Ρ…ΠΎΠ΄Π° ΠΏΠΎ ΠΊΠ»ΠΈΠΊΡƒ. Π’ HTML ΠΌΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ ΡΡ„ΠΎΡ€ΠΌΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ссылку с ΡƒΠ½ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΌ ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€ΠΎΠΌ. Π’ событии ΠŸΡ€ΠΈΠΠ°ΠΆΠ°Ρ‚ΠΈΠΈ для поля HTML-Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π° ΠΌΡ‹ Π°Π½Π°Π»ΠΈΠ·ΠΈΡ€ΡƒΠ΅ΠΌ ΠΊΠΎΠΎΡ€Π΄ΠΈΠ½Π°Ρ‚Ρ‹ ΠΊΠ»ΠΈΠΊΠ° ΠΈΠ»ΠΈ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ элСмСнта ΠΈ выполняСм Π½ΡƒΠΆΠ½ΠΎΠ΅ дСйствиС.

πŸ’‘

Π˜Π½Ρ‚Π΅Ρ€Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΡΡ‚ΡŒ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π° достигаСтся Π½Π΅ Ρ‡Π΅Ρ€Π΅Π· JavaScript Π²Π½ΡƒΡ‚Ρ€ΠΈ HTML, Π° Ρ‡Π΅Ρ€Π΅Π· ΠΏΠ΅Ρ€Π΅Ρ…Π²Π°Ρ‚ событий ΠΊΠ»ΠΈΠΊΠ° Π½Π° ΡƒΡ€ΠΎΠ²Π½Π΅ Ρ„ΠΎΡ€ΠΌΡ‹ 1Π‘ ΠΈ Π°Π½Π°Π»ΠΈΠ· контСкста наТатия.

Π­Π»Π΅ΠΌΠ΅Π½Ρ‚ HTML НазначСниС Π‘Ρ‚ΠΈΠ»ΡŒ (CSS)
<div> ΠšΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€ для Π±Π»ΠΎΠΊΠ° Π΄Π°Π½Π½Ρ‹Ρ… border: 1px solid #ccc; padding: 5px;
<span> Π’Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½ΠΎΠ³ΠΎ числа font-weight: bold; color: blue;
<table> Π’Π°Π±Π»ΠΈΡ‡Π½ΠΎΠ΅ прСдставлСниС списка width: 100%; border-collapse: collapse;
<img> ΠžΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈΠΊΠΎΠ½ΠΊΠΈ статуса width: 16px; height: 16px;

НС Π·Π°Π±Ρ‹Π²Π°ΠΉΡ‚Π΅, Ρ‡Ρ‚ΠΎ слоТная вСрстка ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎ-Ρ€Π°Π·Π½ΠΎΠΌΡƒ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ Π² Ρ€Π°Π·Π½Ρ‹Ρ… вСрсиях ΠΊΠ»ΠΈΠ΅Π½Ρ‚Π° 1Π‘ (Ρ‚ΠΎΠ½ΠΊΠΈΠΉ ΠΊΠ»ΠΈΠ΅Π½Ρ‚, Π²Π΅Π±-ΠΊΠ»ΠΈΠ΅Π½Ρ‚). ВсСгда тСстируйтС Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ Π² Ρ‚ΠΎΠΌ интСрфСйсС, Π³Π΄Π΅ ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ основными ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡΠΌΠΈ.

АвтоматичСскоС ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ Π΄Π°Π½Π½Ρ‹Ρ… Π² Ρ€Π΅Π°Π»ΡŒΠ½ΠΎΠΌ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ

Одной ΠΈΠ· Π³Π»Π°Π²Π½Ρ‹Ρ… ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ΠΎΠ² являСтся Π°ΠΊΡ‚ΡƒΠ°Π»ΡŒΠ½ΠΎΡΡ‚ΡŒ Π΄Π°Π½Π½Ρ‹Ρ…. ΠŸΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ Π½Π΅ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π½Π°ΠΆΠΈΠΌΠ°Ρ‚ΡŒ ΠΊΠ½ΠΎΠΏΠΊΡƒ "ΠžΠ±Π½ΠΎΠ²ΠΈΡ‚ΡŒ" ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ Ρ€Π°Π·, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ Π½ΠΎΠ²Ρ‹ΠΉ Π·Π°ΠΊΠ°Π·. Для Ρ€Π΅ΡˆΠ΅Π½ΠΈΡ этой Π·Π°Π΄Π°Ρ‡ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ ΠΌΠ΅Ρ…Π°Π½ΠΈΠ·ΠΌ Ρ‚Π°ΠΉΠΌΠ΅Ρ€ΠΎΠ² ΠΈΠ»ΠΈ Ρ„ΠΎΠ½ΠΎΠ²Ρ‹Ρ… Π·Π°Π΄Π°Π½ΠΈΠΉ.

Π’ ΠΌΠΎΠ΄ΡƒΠ»Π΅ Ρ„ΠΎΡ€ΠΌΡ‹ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ событиС ΠŸΡ€ΠΈΠžΡ‚ΠΊΡ€Ρ‹Ρ‚ΠΈΠΈ для запуска Ρ‚Π°ΠΉΠΌΠ΅Ρ€Π°. Однако Π±ΡƒΠ΄ΡŒΡ‚Π΅ остороТны: слишком частоС ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, ΠΊΠ°ΠΆΠ΄ΡƒΡŽ сСкунду) создаст лишнюю Π½Π°Π³Ρ€ΡƒΠ·ΠΊΡƒ Π½Π° сСрвСр 1Π‘ ΠΈ ΠΌΠΎΠΆΠ΅Ρ‚ Π·Π°Π±Π»ΠΎΠΊΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ€Π°Π±ΠΎΡ‚Ρƒ Π΄Ρ€ΡƒΠ³ΠΈΡ… ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Π΅ΠΉ ΠΏΡ€ΠΈ интСнсивной Π²Ρ‹Π±ΠΎΡ€ΠΊΠ΅.

⚠️ Π’Π½ΠΈΠΌΠ°Π½ΠΈΠ΅: Π˜Π½Ρ‚Π΅Ρ€Π²Π°Π» обновлСния Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π° Π½Π΅ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ ΠΌΠ΅Π½Π΅Π΅ 5-10 сСкунд. ЧастыС запросы ΠΊ Π±Π°Π·Π΅ Π΄Π°Π½Π½Ρ‹Ρ… ΠΈΠ· интСрфСйса ΠΌΠΎΠ³ΡƒΡ‚ привСсти ΠΊ Π±Π»ΠΎΠΊΠΈΡ€ΠΎΠ²ΠΊΠ°ΠΌ Ρ‚Π°Π±Π»ΠΈΡ† ΠΈ замСдлСнию Ρ€Π°Π±ΠΎΡ‚Ρ‹ всСй ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΎΠ½Π½ΠΎΠΉ систСмы.

ΠžΠΏΡ‚ΠΈΠΌΠ°Π»ΡŒΠ½Ρ‹ΠΌ Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ΠΌ являСтся использованиС события ΠŸΡ€ΠΈΠ˜Π·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈΠ”Π°Π½Π½Ρ‹Ρ… (Ссли Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ встроСн Π² ΠΎΠ±Ρ‰ΡƒΡŽ Ρ„ΠΎΡ€ΠΌΡƒ) ΠΈΠ»ΠΈ настройка Ρ€Π°Π·ΡƒΠΌΠ½ΠΎΠ³ΠΎ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π»Π° Ρ‚Π°ΠΉΠΌΠ΅Ρ€Π°. Π’Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡ‚ΡŒ Π΄Π°Π½Π½Ρ‹Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΏΡ€ΠΈ Π²ΠΎΠ·Π²Ρ€Π°Ρ‚Π΅ фокуса Π½Π° ΠΎΠΊΠ½ΠΎ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹, Ρ‡Ρ‚ΠΎ экономит рСсурсы.

&ΠΠ°ΠšΠ»ΠΈΠ΅Π½Ρ‚Π΅

ΠŸΡ€ΠΎΡ†Π΅Π΄ΡƒΡ€Π° Π’Π°ΠΉΠΌΠ΅Ρ€ΠžΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ()

// ОбновляСм Π΄Π°Π½Π½Ρ‹Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ссли Ρ„ΠΎΡ€ΠΌΠ° Π°ΠΊΡ‚ΠΈΠ²Π½Π°

Если Π­Ρ‚ΠΎΡ‚ΠžΠ±ΡŠΠ΅ΠΊΡ‚.Активно Π’ΠΎΠ³Π΄Π°

ΠžΠ±Π½ΠΎΠ²ΠΈΡ‚ΡŒΠ”Π°Π½Π½Ρ‹Π΅Π’ΠΈΠ΄ΠΆΠ΅Ρ‚Π°();

ΠšΠΎΠ½Π΅Ρ†Π•ΡΠ»ΠΈ;

ΠšΠΎΠ½Π΅Ρ†ΠŸΡ€ΠΎΡ†Π΅Π΄ΡƒΡ€Ρ‹

πŸ’‘

Для тяТСлых Π²Ρ‹Π±ΠΎΡ€ΠΎΠΊ Π΄Π°Π½Π½Ρ‹Ρ… рассмотритС Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΠΊΡΡˆΠΈΡ€ΠΎΠ²Π°Π½ΠΈΡ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ΠΎΠ² Π² рСгистрС свСдСний с ΠΏΠ΅Ρ€ΠΈΠΎΠ΄ΠΈΡ‡Π½ΠΎΡΡ‚ΡŒΡŽ "Π’ ΠΏΡ€Π΅Π΄Π΅Π»Π°Ρ… дня", Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ Ρ‡ΠΈΡ‚Π°Π» Π³ΠΎΡ‚ΠΎΠ²Ρ‹Π΅ ΠΈΡ‚ΠΎΠ³ΠΈ, Π° Π½Π΅ считал ΠΈΡ… ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ Ρ€Π°Π·.

ΠžΡ‚Π»Π°Π΄ΠΊΠ° ΠΈ оптимизация ΠΏΡ€ΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ

ПослС написания ΠΊΠΎΠ΄Π° наступаСт этап тСстирования. ЗапуститС ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΡŽ Π² Ρ€Π΅ΠΆΠΈΠΌΠ΅ ΠΎΡ‚Π»Π°Π΄ΠΊΠΈ ΠΈ ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° врСмя ΠΎΡ‚ΠΊΠ»ΠΈΠΊΠ° ΠΏΡ€ΠΈ ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΠΈΠΈ Ρ„ΠΎΡ€ΠΌΡ‹. Если Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ загруТаСтся дольшС 1-2 сСкунд, Π·Π½Π°Ρ‡ΠΈΡ‚, запрос Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ ΠΎΠΏΡ‚ΠΈΠΌΠΈΠ·Π°Ρ†ΠΈΠΈ.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ тСхнологичСский ΠΆΡƒΡ€Π½Π°Π» (Π’Π–) ΠΏΠ»Π°Ρ‚Ρ„ΠΎΡ€ΠΌΡ‹ 1Π‘ для Π°Π½Π°Π»ΠΈΠ·Π° выполняСмых SQL-запросов. Часто Π±Ρ‹Π²Π°Π΅Ρ‚, Ρ‡Ρ‚ΠΎ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ Π·Π°Π±Ρ‹Π²Π°Π΅Ρ‚ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ условиС ΠΎΡ‚Π±ΠΎΡ€Π° ΠΏΠΎ ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΈΠ»ΠΈ ΠΏΠ΅Ρ€ΠΈΠΎΠ΄Ρƒ, ΠΈ систСма пытаСтся ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ ΠΌΠΈΠ»Π»ΠΈΠΎΠ½Ρ‹ записСй. ΠžΡ‚ΡΡƒΡ‚ΡΡ‚Π²ΠΈΠ΅ Ρ„ΠΈΠ»ΡŒΡ‚Ρ€ΠΎΠ² Π² запросах Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ΠΎΠ² β€” самая частая ΠΏΡ€ΠΈΡ‡ΠΈΠ½Π° падСния ΠΏΡ€ΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ.

ΠŸΡ€ΠΎΠ²Π΅Ρ€ΡŒΡ‚Π΅ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π° Π½Π° Ρ€Π°Π·Π½Ρ‹Ρ… Ρ€Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΡΡ… экрана. Π­Π»Π΅ΠΌΠ΅Π½Ρ‚Ρ‹ с фиксированной ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ Π² пиксСлях ΠΌΠΎΠ³ΡƒΡ‚ "ΠΏΠΎΠ΅Ρ…Π°Ρ‚ΡŒ" Π½Π° Π±ΠΎΠ»ΡŒΡˆΠΈΡ… ΠΌΠΎΠ½ΠΈΡ‚ΠΎΡ€Π°Ρ… ΠΈΠ»ΠΈ ΠΎΠ±Ρ€Π΅Π·Π°Ρ‚ΡŒΡΡ Π½Π° Π½ΠΎΡƒΡ‚Π±ΡƒΠΊΠ°Ρ…. Π‘Ρ‚Π°Ρ€Π°ΠΉΡ‚Π΅ΡΡŒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΎΡ‚Π½ΠΎΡΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ Π΅Π΄ΠΈΠ½ΠΈΡ†Ρ‹ измСрСния ΠΈΠ»ΠΈ ΠΏΡ€ΠΎΡ†Π΅Π½Ρ‚Ρ‹ Π² стилях.

Как ΠΎΡ‚Π»Π°Π΄ΠΈΡ‚ΡŒ HTML-ΠΊΠΎΠ΄, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π³Π΅Π½Π΅Ρ€ΠΈΡ€ΡƒΠ΅Ρ‚ 1Π‘?

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ вывСсти ΡΠ³Π΅Π½Π΅Ρ€ΠΈΡ€ΠΎΠ²Π°Π½Π½ΡƒΡŽ строку HTML Π² ΠΎΠ±Ρ‹Ρ‡Π½ΠΎΠ΅ многострочноС тСкстовоС ΠΏΠΎΠ»Π΅ Π½Π° Ρ„ΠΎΡ€ΠΌΠ΅ для Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎΠΉ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΊΠΈ структуры Ρ‚Π΅Π³ΠΎΠ² ΠΏΠ΅Ρ€Π΅Π΄ Π·Π°Π³Ρ€ΡƒΠ·ΠΊΠΎΠΉ Π΅Ρ‘ Π² HTML-Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚. Π­Ρ‚ΠΎ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚ Π½Π°ΠΉΡ‚ΠΈ Π½Π΅Π·Π°ΠΊΡ€Ρ‹Ρ‚Ρ‹Π΅ Ρ‚Π΅Π³ΠΈ.

МоТно Π»ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π±ΠΈΠ±Π»ΠΈΠΎΡ‚Π΅ΠΊΠΈ jQuery Π²Π½ΡƒΡ‚Ρ€ΠΈ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π° 1Π‘?

ВСхничСски ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ внСшниС скрипты, Π½ΠΎ это ΠΊΡ€Π°ΠΉΠ½Π΅ Π½Π΅ рСкомСндуСтся ΠΈΠ·-Π·Π° ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌ с Π±Π΅Π·ΠΎΠΏΠ°ΡΠ½ΠΎΡΡ‚ΡŒΡŽ ΠΈ ΡΠΎΠ²ΠΌΠ΅ΡΡ‚ΠΈΠΌΠΎΡΡ‚ΡŒΡŽ Π² Ρ€Π°Π·Π½Ρ‹Ρ… Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°Ρ…, встроСнных Π² ΠΊΠ»ΠΈΠ΅Π½Ρ‚ 1Π‘. Π›ΡƒΡ‡ΡˆΠ΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ чистый JS ΠΈΠ»ΠΈ возмоТности ΠΏΠ»Π°Ρ‚Ρ„ΠΎΡ€ΠΌΡ‹.

ΠŸΠΎΡ‡Π΅ΠΌΡƒ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ Π½Π΅ отобраТаСтся Π² Π²Π΅Π±-ΠΊΠ»ΠΈΠ΅Π½Ρ‚Π΅?

Π’Π΅Π±-ΠΊΠ»ΠΈΠ΅Π½Ρ‚ ΠΈΠΌΠ΅Π΅Ρ‚ Π±ΠΎΠ»Π΅Π΅ строгиС ΠΏΠΎΠ»ΠΈΡ‚ΠΈΠΊΠΈ бСзопасности (CSP). Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Π² вашСм HTML Π½Π΅Ρ‚ конструкций, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ считаСт опасными, ΠΈ Ρ‡Ρ‚ΠΎ ΠΏΡƒΡ‚ΠΈ ΠΊ рСсурсам (Ссли Π΅ΡΡ‚ΡŒ) ΠΊΠΎΡ€Ρ€Π΅ΠΊΡ‚Π½Ρ‹.

Как ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‚ΡŒ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ ΠΈΠ· Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π° Π² ΠΎΡ‚Ρ‡Π΅Ρ‚?

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Π³Π»ΠΎΠ±Π°Π»ΡŒΠ½Ρ‹Π΅ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Π½Π½Ρ‹Π΅ Ρ„ΠΎΡ€ΠΌΡ‹ ΠΈΠ»ΠΈ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ сСанса. ΠŸΡ€ΠΈ ΠΊΠ»ΠΈΠΊΠ΅ Π½Π° элСмСнт Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π° записывайтС Π½ΡƒΠΆΠ½Ρ‹Π΅ значСния (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, ID ΠΊΠΎΠ½Ρ‚Ρ€Π°Π³Π΅Π½Ρ‚Π°) Π² ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Π½Π½ΡƒΡŽ, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ Π·Π°Ρ‚Π΅ΠΌ ΠΏΠΎΠ΄Ρ…Π²Π°Ρ‚ΠΈΡ‚ Ρ„ΠΎΡ€ΠΌΠ° ΠΎΡ‚Ρ‡Π΅Ρ‚Π°.

НуТно Π»ΠΈ Ρ€Π΅Π³ΠΈΡΡ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ Π² Π»ΠΈΡ†Π΅Π½Π·ΠΈΠΎΠ½Π½ΠΎΠΌ соглашСнии?

НСт, созданиС Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ΠΎΠ² являСтся стандартной Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½ΠΎΡΡ‚ΡŒΡŽ ΠΏΠ»Π°Ρ‚Ρ„ΠΎΡ€ΠΌΡ‹ 1Π‘:ΠŸΡ€Π΅Π΄ΠΏΡ€ΠΈΡΡ‚ΠΈΠ΅ ΠΈ Π½Π΅ Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… Π»ΠΈΡ†Π΅Π½Π·ΠΈΠΉ, Ссли Π²Ρ‹ Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚Π΅ сторонниС ΠΏΠ»Π°Ρ‚Π½Ρ‹Π΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Ρ‹.