Создайте файл HTML : index.html

Внутри тега body создайте теги input и button.

Дайте тегу input id имя message .

Также дайте событие onClick тегу кнопки с именем speak .

Ниже этого создайте тег script и создайте функцию с именем speak.

  1. Объявите переменную с помощью const и передайте SpeechSynthesisUtterance
  2. Внутри SpeechSynthesisUtterance извлеките значение тегов input с помощью метода document.getElementById.
  3. Последний шаг: добавьте window.speechSynthesis.speak(msg), чтобы наш браузер мог повторить все, что мы ввели в теге ввода.

Зайди в браузер и проверь :)

Давайте добавим что-то еще на наш сайт, время изменить голос. Вам может быть интересно, как ?🤔

Я здесь, чтобы рассказать вам, просто продолжайте читать блог :)

Под переменной msg создайте переменную с именем voices и передайте window.speechSynthesis.getVoices()

После этого отредактируйте переменную msg, используя следующий код:

Примечание: .getVoices предоставляет массив. Вы можете изменить числа между 1-10

И вот оно.

Вот окончательный код:

Подпишитесь на меня на Medium, чтобы увидеть больше таких превосходных блогов :), а также не забудьте подписаться на JavaScript in Plain English.

Есть сомнения?
Свяжитесь со мной:
Discord: ! Герой々#0001
Твиттер

Надеюсь, вам понравилось читать.

Скоро вернусь с другим блогом, чтобы быть в курсе моих блогов, подпишитесь на меня в среде или подпишитесь на информационный бюллетень.

До тех пор, удачного дня и всегда улыбайся. :)

Спасибо,

Герой