Web Analytics Made Easy -
StatCounter Basic HTML/Javascript Question - CodingForum

Announcement

Collapse
No announcement yet.

Basic HTML/Javascript Question

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Basic HTML/Javascript Question

    Hey everyone,

    I'm pretty new to coding--I have basic experience in HTML & CSS, and am currently learning Javascript. This might be a dumb question, but I don't understand how one incorporates Javascript into the actual HTML code...like, I know you use a <script> tag to incorporate it, but how do you connect the two (HTML and Javascript).

    I'm working on a project where I need to create a 5-question quiz, but I don't understand how I will incorporate the Javascript to the HTML questions to make it do what I want it to do. Do I link the two via classes? More specifically, how do I link the specific Javascript code to the specific HTML code?

    I know this question is a bit broad, but I really appreciate the help!

    Thanks,
    TomTom

  • #2
    You can inline or link with the script tag or both.

    Code:
    <script>
        // JavaScript inline here.
    </script>
    Link a JavaScript file.
    The file will run as soon as the browser reads the script tag.

    Code:
    <script src="path/to/script.js"></script>
    The lecture or course reading should have described how to reference HTML elements using JavaScript. Once you have a reference you can get and change the attributes and values of a HTML element. So yes, you can get an element by it's class, id, or any other attributes which I why I recommended reviewing what's been covered so far since there are multiple paths to the solution.
    Last edited by Clock Out; Sep 18, 2016, 11:22 AM.

    Comment


    • #3
      Let's try if this helps you:
      but how do you connect the two (HTML and Javascript).
      You can access a HTML element by giving an ID to it and using the function getElementById:
      Code:
      var ele = document.getElementById("id-of-html-element");
      After that the variable ele contains a Javascript representation of your HTML element. You can use this to modify the element, e. g. by altering the CSS:
      Code:
      var ele = document.getElementById("id-of-html-element");
      ele.style.color = "red";
      This is a very simple example. You can also create elements in Javascript and insert them into the DOM. These are not visible in the HTML text but will be displayed by the browser.

      Comment


      • #4
        PS: You write about a quiz. Some time ago I created this one:
        https://jsfiddle.net/Sempervivum/mv235szw/3/
        where I use the technique of creating HTML Elements by JS. However, when your quiz has only five questions it might be sufficient to place them all onto one page.

        Comment


        • #5
          I wrote a whole lot of quiz scripts a long time ago - Felgall Internet - Javascript Quiz Makers

          The code they use is somewhat dated and I have never got around to modernising the code because I don't think JavaScript is the right language to be creating quizes.
          Stephen
          Learn Modern JavaScript - http://javascriptexample.net/
          Helping others to solve their computer problem at http://www.felgall.com/

          Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

          Comment

          Working...
          X