Need help with these questions

JavaScript
1

-Write a function that takes 1 parameter and writes the squared value of that parameter to the page.

-Write a function that gets the value from a HTML Input element named “numberInput”, divides it by 3 and writes the value to the page.

These are some questions in my intro coding class, just need help asnwering them/

2

Hi there kestrin15,

and a warm welcome to these forums. :winky:

  1. Do you understand the questions?
  2. If you do, can we see your attempts at answering them?
  3. If you don’t, do you want us to write code that you
    probably won’t be able understand at your present level?

coothead

3

Yeah, it’s not a test question or anything. I like learning from seeing the code typed out, I can learn from looking at the answers(code) and figuring it out! So go ahead and write it out and I will let you know if I am confused

4

“it’s not a test question or anything”. Well now that you’ve said that :stuck_out_tongue:

Your intro class has introduced functions, correct?

What part of the questions are you having trouble with?
Do you understand what a function is? Do you know how to write one?
Do you understand what a parameter is?
Do you understand how Javascript interacts with DOM elements? Do you understand what a DOM element is?

1 Like
5

Here you go…

<!DOCTYPE HTML>
<html lang="en">
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1">

<title>untitled document</title>

<link rel="stylesheet" href="screen.css" media="screen">

<style media="screen">
body {
    background-color: #f0f0f0;
    font: 1em/150% verdana, arial, helvetica, sans-serif;
    text-align: center;
 }

h1 {
    font-size: 1em;
 }

.number-testing {
    display: inline-block;
    padding: 1em;
    border: 0.062em solid #999;
    border-radius: 0.75em;
    box-shadow: 0.4em 0.4em 0.4em rgba( 0, 0, 0, 0.3 );
    background-color: #fff;
    text-align: left;
 }

.number-testing div {
    padding: 0.5em 0;
 }

.number-testing label{
    display: block;
    padding: 0.5em 0;
}
 </style>

</head>
<body> 

<h1>Number manipulation</h1>

 <form class="number-testing">
  <div>
   <label for="base0">base number to square: </label>
   <input id="base0" type="number" value="0">
   <label for="squared">base number squared: </label>
   <input id="squared" type="text" value="0" readonly>
  </div><div>
   <label for="base1">base number to divide by 3: </label>
   <input id="base1" type="number"  value="0">
   <label for="divided">base number divided by 3: </label>
   <input id="divided" type="text" value="0" readonly>
  </div><div>
   <input type="reset" value="clear fields">
  </div>
 </form>

<script>
(function( d ) {
   'use strict';
 
   d.getElementById( 'base0' ).addEventListener( 'input', function() {
   d.getElementById( 'squared' ).value = this.value * this.value;
   }, false );

   d.getElementById( 'base1' ).addEventListener( 'input', function() {
   d.getElementById( 'divided' ).value = this.value / 3;
   }, false );
}(  document ));
</script>

</body>
</html>

coothead

6 
const squared = x => x*x;

const showNumberInput = form => {
  document.innerHTML += form.elements.numberInput.value / 3;
};

These code snippets don’t work in isolation, for there are many different types of environmental setups that result in changes needing to be made, but they help to serve as a good start to things.

7

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.