const numbers = [1, 3, 5, 7];

// Проверяем, есть ли число 5 в массиве
console.log(numbers.includes(5)); // true

const text = "Привет, мир!";
console.log(text.includes("мир")); // true

<!-- Открытие ссылки в новой вкладке -->
<a href="https://example.com" target="_blank">Открыть в новой вкладке</a>

<!-- Открытие ссылки в том же окне -->
<a href="https://example.com" target="_self">Открыть в этом же окне</a>

<!-- Открытие в новом окне без доступа к родительскому -->
<a href="https://example.com" target="_blank" rel="noopener noreferrer">Открыть безопасно</a>

Атрибут target важен для управления поведением ссылок и безопасности веб-страниц.

<img src="image.jpg" class="responsive-img" alt="Пример изображения">

<style>
  .responsive-img {
    width: 300px;
    height: 200px;
    object-fit: cover; /* Заполняет контейнер, обрезая лишнее */
  }
</style>

const text = "JavaScript — крутой язык!";

// Проверяем, начинается ли строка с "Java"
console.log(text.startsWith("Java")); // true

// Проверяем с учетом позиции
console.log(text.startsWith("крутой", 13)); // true

<!-- Кнопка без видимого текста, но с доступным описанием -->
<button aria-label="Открыть меню">
  <img src="menu-icon.svg" alt="">
</button>

Атрибут aria-label помогает делать сайты доступными для всех и соответствует стандартам Web Accessibility (WCAG).

<div class="box">Этот текст слишком длинный для блока и может выходить за его границы.</div>

<style>
  .box {
    width: 200px;
    height: 50px;
    border: 1px solid black;
    overflow: hidden; /* Обрезаем лишний контент */
  }
</style>

const text = "frontend — это круто!";

// Проверяем, заканчивается ли строка на "круто!"
console.log(text.endsWith("круто!")); // true

// Проверяем с ограничением по длине
console.log(text.endsWith("frontend", 8)); // true

<!-- Иконка, не нужная для экранных читалок -->
<span aria-hidden="true">🔔</span>

<!-- Видимый, но скрытый от читалок текст -->
<p aria-hidden="true">Этот текст будет проигнорирован</p>

Атрибут aria-hidden помогает создавать семантически корректные интерфейсы, соответствующие стандартам Web Accessibility (WCAG).

<div class="box">Этот блок всегда виден</div>
<div class="box hidden">А этот скрыт, но занимает место</div>

<style>
  .box {
    width: 200px;
    height: 50px;
    border: 1px solid black;
    text-align: center;
    line-height: 50px;
  }

  .hidden {
    visibility: hidden; /* Элемент становится невидимым, но остаётся на месте */
  }
</style>

const num = "7";

// Дополняем до двух символов нулями
console.log(num.padStart(2, "0")); // "07"

// Выравнивание текста
console.log("JS".padStart(5, "-")); // "--JS"