eugeniy.ho
/
javascript_practice


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132
							<!DOCTYPE HTML>
<html lang="ru">
<head>
  <meta charset="UTF-8">
  <title>
    Static File Index.HTML
  </title>
  <script src='https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js'></script>
</head>
<body>
<div id='formContainer'>
  <input id="nickInput" class="nick" type="text" placeholder="Ник"><br>
  <input id="messageInput" class="message" type="text" placeholder="Сообщение"><br>
  <button id="sendButton" type="button">Отправить</button>
</div>
<script>
  const socket = io('http://socketchat.ed.asmer.org.ua/');
  socket.on('msg', ({nick, message})  => {
    let divElement = document.createElement('div');
    divElement.innerText = `nick - ${nick}, message - ${message}`
    document.querySelector('#formContainer').appendChild(divElement);
  });

  document.querySelector('#sendButton').addEventListener('click', () => {
    let nickInput = document.querySelector('#nickInput').value;
    let messageInput = document.querySelector('#messageInput').value;
    socket.emit('msg', {nick: nickInput, message: messageInput});
  });

</script>
</body>
</html>