Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialKen Alger
Treehouse TeacherinnerText
Mr. Chalkley describes some of the differences between innerText and innerHTML. After a bit of frustration with my code not working in Firefox, I discovered that Firefox does not support innerText. So, for the project I used innerHTML and/or textContent in it's place.
I know there is a jQuery way around this, but to utilize strictly JavaScript what is the best method to satisfy all browsers?
3 Answers
Andrew Chalkley
Treehouse Guest TeacherHey Ken,
Thanks for pointing this out. I've included some fairly straightforward cross-browser code below with some comments explaining what's going on.
//check if innerText is undefined
if (typeof editButton.innerText === "undefined") {
//if it is undefined use textContent
editButton.textContent = "Edit";
} else {
//else use innerText
editButton.innerText = "Edit";
}
You can see why you'd want to use jQuery for a lot of this stuff. The difference between writing JavaScript in the browser and other environments like in Node.js or the other examples I shared, is that browsers don't always agree. Generally when an API is defined there won't be much of this branching code, but in the browser you could be doing it quite a bit.
Regards,
Andrew
Ricardo Hill-Henry
38,442 PointsTry using textContent Also, here's a post on stack that should help explain it: http://stackoverflow.com/questions/1359469/innertext-works-in-ie-but-not-in-firefox
Chris Shaw
26,676 PointsHi Ken,
There is a nice explanation as to why Firefox doesn't use innerText
on the MDN, essentially is comes down to web standards as mentioned in the Stack Overflow thread.
https://developer.mozilla.org/en-US/docs/Web/API/Node.textContent#Differences_from_innerText
Keith Barlow
5,114 PointsKeith Barlow
5,114 Points? So why don't you add this to the tutorial? Do you have any idea how much of peoples time you waste?
And also edit out your Umms and arrs and also when you make typos????
OK Cool!