+ 1
How to practice combining JS and HTML.
I found the JavaScript tutorials easy because I know how to code. I tested out of most of the lessons. Yet, I don't understand how any actual webpages' behaviors work. How do I learn how to use js within HTML?
4 Antworten
+ 2
This is an example
<DOCTYPE html>
<html>
<body>
<h1 id="beat"></h1>
<button onclick="beat ()"> HIT ME </button>
<script>
function beat (){ document.getElementById("beat").innerHTML="This has Changed";
}
</script>
</body>
</html>
this creates a button named hit me. so when you hit the button the text will be changed. The get element by id method takes id of that element and manipulate it. In this case I'm using a function called beat () and place it in the button so that when you hit the button the text will be changed. using innerHTML to write in the h1 refered by an id called beat. There are many ways to use java script to manipulate html this is just an example
+ 1
You just need to know what is needed in java script to target those elements. document.getElementById is one way of achieving that. But just download an application in Google store that will give references
+ 1
Learn the basics of html, then learn how to create and modify html elements with js (with the methods of the document object and css selectors), and then practice writing userscripts. Userscripts are custom js scripts that you set to run when browsing specific pages on the web to change their appearance, extend the functionnalities, etc. Depending on your browser, you need either Greasemonkey (Firefox) or Tampermonkey (Chrome) to run them. Set up the extension to launch your favorite text editor when editing scripts to be more at ease (use Notepad++ for example). Then browse any site and aim to add/move/change/delete a specific element on the page. Go on a forum you like, and change the background color of all your posts. Stuff like that. Be creative.
0
If you can create Todo App, you are ready to write more apps. Why? If you use google search, youtube etc...all have same pattern. Get input from user, then displaying result thru loops.