test

pour test

by DupontTD

HTML

<p data-secret="jesuistonprof">Start Wars</p>
 <section class="Q1">
   <form>
  Value of <code>data-secret</code>: <input class="target" type="text" size="10">
</form>
  <aside class="response success" style="display:none">Correct!</aside>
  
 </section>

CSS

.success, .success code{
    background: #e0f2f1;
    color: #00897b;
}

p {
  border : 1px solid;
  display : inline-block;
  padding : 10px;
}

JavaScript

let target = document.querySelector('section.Q1 .target'),
    response = document.querySelector('section.Q1 .response');
target.addEventListener('keyup', (e) => {
   e.preventDefault();
  response.style.display = target.value === 'jesuistonprof' ? 'block' : 'none';
 
  
});