Question

Would you like to explain what is different between

document.getElementById("something") 

and

$("#something")

I am trying to upload a document using ajax and I realised that

var upl = document.getElementById('uplFile');
    console.log(upl.files);

returning an object but

var upl = $('#uplFile');
    console.log(upl.files);

returning “undefined”

Please, explain a diffrerence.

Answer 1

I think that you mean the difference between:

document.getElementById("something")

and

$('#something')

The first one will return the DOM element with the specified id, or null.

The second one will return a jQuery object, which will either contain the DOM element with the specified id, or be an empty jQuery object (length = 0).

As the jQuery function returns a jQuery object and not an element, you have to get the element out of the jQuery object to access the element properties:

var upl = $('#uplFile');
console.log(upl[0].files);