Создайте файл HTML : index.html
Внутри тега body создайте теги input
и button
.
Дайте тегу input
id
имя message
.
Также дайте событие onClick
тегу кнопки с именем speak
.
Ниже этого создайте тег script
и создайте функцию с именем speak
.
- Объявите переменную с помощью
const
и передайтеSpeechSynthesisUtterance
- Внутри
SpeechSynthesisUtterance
извлеките значение теговinput
с помощью методаdocument.getElementById
. - Последний шаг: добавьте
window.speechSynthesis.speak(msg)
, чтобы наш браузер мог повторить все, что мы ввели в теге ввода.
Зайди в браузер и проверь :)
Давайте добавим что-то еще на наш сайт, время изменить голос. Вам может быть интересно, как ?🤔
Я здесь, чтобы рассказать вам, просто продолжайте читать блог :)
Под переменной msg
создайте переменную с именем voices
и передайте window.speechSynthesis.getVoices()
После этого отредактируйте переменную msg
, используя следующий код:
Примечание: .getVoices
предоставляет массив. Вы можете изменить числа между 1-10
И вот оно.
Вот окончательный код:
Подпишитесь на меня на Medium, чтобы увидеть больше таких превосходных блогов :), а также не забудьте подписаться на JavaScript in Plain English.
Есть сомнения?
Свяжитесь со мной:
Discord: ! Герой々#0001
Твиттер
Надеюсь, вам понравилось читать.
Скоро вернусь с другим блогом, чтобы быть в курсе моих блогов, подпишитесь на меня в среде или подпишитесь на информационный бюллетень.
До тех пор, удачного дня и всегда улыбайся. :)
Спасибо,
Герой