Использование JavaScript в HTML на CodePen: пошаговое руководство

Чтобы использовать JavaScript в HTML на CodePen, вы можете выполнить следующие действия:

  1. Откройте CodePen: перейдите на веб-сайт CodePen (codepen.io) и войдите в систему или создайте новую учетную запись.

  2. Создание новой ручки: нажмите кнопку «Новая ручка», чтобы создать новую ручку.

  3. Раздел HTML. В разделе HTML вы можете написать свой HTML-код. Например:

<!DOCTYPE html>
<html>
<head>
<title>My CodePen Example</title>
</head>
<body>
<h1>Hello, World!</h1>
<script src="script.js"></script>
</body>
</html>

В этом примере тег сценария включен в тег body. Атрибут srcуказывает файл JavaScript, на который необходимо связать ссылку, в данном случае «script.js». Вы можете заменить «script.js» именем вашего файла JavaScript.

  1. Раздел JavaScript. В разделе JavaScript вы можете написать свой код JavaScript. Например, создайте файл с именем «script.js» и добавьте следующий код:
console.log("Hello, JavaScript!");

Этот код просто зарегистрирует «Привет, JavaScript!» в консоль браузера.

  1. Раздел CSS (необязательно). Если вы хотите добавить стили CSS, вы можете включить их в раздел CSS.

  2. Сохранить и запустить: нажмите кнопку «Сохранить», чтобы сохранить ручку, а затем нажмите кнопку «Выполнить», чтобы увидеть результат.

Вот и все! Теперь вы можете включать код JavaScript в свой HTML-код на CodePen.