JavaScript - получение значения содержимого Div - замену содержимого неправильной строкой

Question

Ссылка на jsFiddle .

Если textarea не заполнено, в контенте должно быть написано "Вы должны сказать мне шутку!"с помощью Javascript.

Вместо этого, даже если textarea пусто, содержание все равно изменяется на «было ли смешно твоя шутка?»

Соответствующий код:

HTML

<div class="row"><!--third row -->

  <div class="col-2 joker">
      <img src="/joker.png"/>
      <p id="jokerDialogue">Tell me a joke</p>
  </div>

  <div class="col-2">
      <table>

      <tr>
      <td>Joke:</td>
      </tr>

      <tr>
      <td>
      <textarea id="jokeQuestion" type="string" min="1" max="24" size="24"> 
      </textarea>
      </td>
      </tr> 

      <tr>
      <td>
      <input id="submit-joke" type="button" value="submit" class="js-button" 
      onclick="joker()">
      </td>
      </tr>

      </table>
  </form>
  </div>

  <div class="col-8">             
  </div>

</div>

Javascript

function joker() {

   let content = document.getElementById("jokeQuestion");
   if (content != "") {
      document.getElementById("jokerDialogue").innerHTML = "Was your joke funny?";
   }
   else if (content == "") {
      document.getElementById("jokerDialogue").innerHTML = "You must tell me a joke!";
   }
}

Как видите, я пытаюсь создать переменную content и сказать, что это что-топользователь вводит в textarea с идентификатором jokeQuestion.

Но даже когда content не заполнен, <p> с идентификатором "jokerDialogue" все еще изменяется на "Was your joke funny?"

Я думал, что if (content != "") означало «если содержимое не пустое» - так почему же функция возвращает «Была ли ваша шутка смешной?»даже когда пусто?

Answer 1

Вам нужно получить value из content:

let content = document.getElementById("jokeQuestion").value;

Теперь ваш код будет работать как положено.