innerText vs textContent - getting some errors on Firefox [duplicate]

Question

I'd getting some errors on my scripts here, in the first one I've declared a var text(); type to create a box with some text content.

var x=$('#x').text();

In my second .js I'm doing some handling on this var that ensure my text i'll have less char than max-length, here is:

var limitMaxLength = function(element) {
   var maxLength = $(element).data("max-length");
      if (maxLength) {
         $(element).on("keypress", function(event){
            if (event.target.innerText.length > maxLength || event.keyCode === 13) {
               event.preventDefault();
            }
      });
   }
};

So I having some issues on Firefox getting this error: [TypeError: event.target.innerText is undefined]

In IE, Opera, Chrome and Safari my code works fine, i'm getting error only on Firefox. *Sorry for my bad english.

Answer 1

innerText was a Microsoft Creation, left over from the days of old. Firefox decided not to support it in favour of the w3 compliant, textContent. However, IE8 & below do not support textContent, therefore, if you wish to support Legacy browsers, you're in a bit of a bind.

var text = elem.textContent || elem.innerText;

or

elem.innerHTML // eww, but it works, eh?

or, just ditch IE8 (easier said than done, especially at work)