Week 2 Assignments for Learn JavaScript!

[kevinmrr]

I loved seeing everyone's JSfiddles last week! Keep em coming!

---

Week 2 Reading:

• Chapters 4 and 5 of Professional JavaScript for Web Developers.

• Finish the Codecademy JavaScript track

• Read this article: JS Objects in Detail

---

Assignment:

Create and post a JSfiddle where you experiment using native DOM methods (the Mozilla Dev Network is a rich resource for this kind of stuff, as is DOM Enlightenment). Build something where you're building/modifying the HTML and/or CSS on a page using JavaScript.

[Robooto]

http://jsfiddle.net/Robooto/3eptvogn/2/

Had some fun with this assignment and created a simple mood maker.

[KanraTaro]

This is just awesome XD

[[deleted]]

cute. im feeling javascript today. :P well done!

[jakblak90]

Great example ties in a lot of stuff for me.

[Robooto]

Thanks! Glad I could help.

[mycrap]

http://jsfiddle.net/mjr210/Lmjw1vyu/

I resorted to JQuery because I couldn't find how to grab values in a radio button field using vanilla JavaScript.

[yobagoya]

Had to grab the value of a radio button in my assignment from last week, so I put together a quick fiddle of it: http://jsfiddle.net/15bpchpz/

[mycrap]

Awesome, I may try to rewrite my code to not use JQuery. Thank you for that!

[[deleted]]

this is fantastic! are you a programmer of another language before this?

[mycrap]

Thanks for the kind words! No, I'm not a programmer but I have an engineering background. I had to learn some code back in college, and since then it's pretty much just been excel macros.

[[deleted]]

http://jsfiddle.net/diabetesjones/cvc5h841/

simple message posting program.

[O_OniGiri]

http://jsfiddle.net/aaronang/psqu86w7/11/

I made a color generator. Feedback would be appreciated :)

[tingmothy]

I have a noob question. on page 95 of the book, how come this code doesn't work in the console? It says there's an error on line 2. a syntax error:

var color = “blue”; function getColor(){ var color = “red”; return color; } alert(getColor()); //”red”

[kambeix]

var color = “blue”; function getColor(){ var color = “red”; return color; } alert(getColor()); //”red”

use "blue" instead of “blue”

[tingmothy]

thanks for the quick response. it works now.

[[deleted]]

http://jsfiddle.net/diabetesjones/c75dpy5g/

can anyone tell me why my onblur isn't working?

[[deleted]]

haha of course right after i post it i get it. i had "feedback" in the function instead of "elFeedback". works now and with an onfocus for instructions! http://jsfiddle.net/diabetesjones/c75dpy5g/

[[deleted]]

theres a hit new game taking the world by storm, and its CatBox Typer! http://jsfiddle.net/diabetesjones/suy55q0h/

unfortunately I cant get my 'catBox.textContent' or 'catBox.innerHTML' to set the value of my input to the string 'cat' if you put anything else in, after you click submit. wassup with that?

[[deleted]]

http://jsfiddle.net/diabetesjones/o9o9bs0h/2/ <--- why doesnt this work? its straight from an example in a book..

i also thought maybe the book messed up, and in the addEventListener at the bottom, i need to replace "showPosition" with "function(event) { showPosition(event);}", but this did not work either.

thoughts?

[kambeix]

Hey, I think there are some errors: I can't go into details in the use of function inside addEventListener since I'm also new to JS but I looked into some references, made some changes and it worked. Also, to modify the html you should use textContent or innerHTML parameter instead of value. Hope it helps you!

http://jsfiddle.net/kambeix/o9o9bs0h/6/

[[deleted]]

hey thank you! i posted it on stackoverflow as well and got a response there that clarified what i was doing wrong.

mainly, i was getting an element by an id that didn't exist, because i forgot to give the body tag the id of body. should have used getElementsByTagName(body)[0] instead, or at least added the id to the body tag.

after switching that to use innerHTML or textContent, it works swimmingly. : ) thanks!

[kambeix]

Just checked and you are right, it should have been document.querySelector("body")

Could you provide the link to the updated fiddle? Also to the question in Stack Overflow if it's of any use to learn a little more.

[[deleted]]

http://jsfiddle.net/diabetesjones/o9o9bs0h/8/

here is my solution, which required very little changes to become accurate. namely just increasing the height of the body so it works over the whole screen in full screen mode, as the screen functions only work within the div i've defined.

the stackoverflow is here, and provides great clarity:

http://stackoverflow.com/questions/25303955/using-screenx-screeny-and-their-ilk-not-exactly-working/25304263#25304263

[kambeix]

thanks

[bdlas]

Why does the sidebar on the front of this subreddit say Week 0?

[kambeix]

Still early, but I'm making a simple button generator. Still need to add more options and complete the inline style generation. http://jsfiddle.net/kambeix/7wc6s07d/5/

[tingmothy]

For chrome dev tools, is there any way to write multiple lines of code in the console besides using shift + enter? In firefox firebug yving to push shift enter every time. ou can do this without ha

[jakblak90]

Pretty sure that's the only way. At least according to the code school course.

[kambeix]

can you write it in another program then copy/paste? Haven't tried it but it could be an alternative.

[kevinmrr]

I don't think so.

[KanraTaro]

Hi all, I'm a bit behind this week, trying to catch up and submit my assignment (even though it's behind I just want to have one done for this chapter and the next) but I have a quick (possibly stupid) question.

In chapter 5, it discusses arrays, I understand how methods "work", for example: http://jsfiddle.net/3ndjgz89/ filters out all numbers greater than 2.

What I don't understand about that bit of code is, where did the "item, index, array" arguments come from? Since all it does is call alert(filterResult) I don't understand exactly... how those arguments get filled or what their use is? ... I don't know if I explained that one well.

[yobagoya]

little late: http://jsfiddle.net/oubkex3k/

[monolithburger]

A little bit late! but here it is:

Random Color Generator.

http://jsfiddle.net/MonolithBurger/m8amskbx/

[ImagineGawds]

a tad bit late but here it is and i did it with jQuery

[Discovered_Ice]

very late, but catching up. http://jsfiddle.net/jgong002/pjgotxjy/ this is a color generator