Javascript || e.target 和 e.value 问题

Question

Currently I am learning JavaScript from JavaScript & jQuery by Jon Duckett.

Very interesting book and now I am stumped at an exmaple laid down in book in Chapter 6 Events, specifically in exmaple focus-blur.js.

The example is simple, it just shows the working of focus & blur events by calling different functions when those events occur.

My issue arises at line 7 of image attached issue

My function checkUsername simply doesn't works on blur event.

But, If I replace the code in line 7 by this code var target = el.value; the issue gets solved.

Why so?

I've also attached html code below html code

Answer 1

value is a property of an element. Element has no target .

You are confusing it with an event :

function checkUsername(event) {
   var target = event.target;
}

event does have a target , which is the element where the event got generated.

See event.target documentation

Answer 2

el is a reference to the text input element.

Input elements of type text have a value property with which you can get / set their content ( == what the user has typed).

=> If you write 'el.value' you get the content of the textbox. The content is a string which gots a length-property. The length-property is checked in the if-condition ...