import turtle tina = turtle.Turtle() tina.shape("turtle") #EscapeDucksWithTeeth for x in range(0,10): for x in range(0,4): #value in comics was 10 - play with other values turtle.forward(40) turtle.right(90) #value in comics was 10 - play with other values turtle.forward(40)

import turtle tina = turtle.Turtle() tina.shape("turtle") #ToDefeatTheCreep is a function in the comics #can you make a function out of the following code block? for x in range(0,4): for x in range(0,3): #forward was 15 in the comic but this is arbitrary turtle.forward(45) turtle.right(90) turtle.left(180)

x = 3 # print x # Just an if statemet # if x == 3: # print 'x equals three' # two if statements in a row # if x == 3: # print 'x equals three' # if x !=2 : # print 'x DOES NOT equal two' # if else statement if x == 3: print 'x equals three' else: print 'x DOES NOT equal two' # if elif (else if), else if x == 3: print 'x equals three' elif x == 4: print 'x equals four' else: print 'x is not three or four' def portal(): # tina.pendown() tina.forward(15) tina.left(60) tina.forward(15) tina.right(180) tina.forward(15) tina.left(60)

x = input('what is the number?') if int(x) < 7: print 'go left' else: print 'go right'# def secret_passage(num): # y = input('function: what is the number?') # if int(y) <textarea num: # print 'go left' # else: # print 'go right' # secret_passage(7) # secret_passage(7)

import turtle tina = turtle.Turtle() tina.shape("turtle") sc = turtle.Screen() # initial portal # aka josh rules def portal(): tina.forward(15) tina.left(60) tina.forward(15) tina.right(180) tina.forward(15) tina.left(60) # portal() # portal() # portal() # portal() # portal() # portal() # this is fun # tina.ondrag(turtle.goto) def move(x, y): tina.penup() tina.goto(x, y) sc.onclick(move) def draw(x, y): tina.pendown() portal() tina.onclick(draw) # for x in range(0,6): # portal()

import turtle tina = turtle.Turtle() tina.shape("turtle") # initial portal # aka josh rules def portal(): tina.forward(15) tina.left(60) tina.forward(15) tina.right(180) tina.forward(15) tina.left(60) portal() portal() portal() portal() portal() portal() # for x in range(0,6): # portal()

import turtle tina = turtle.Turtle() tina.shape("turtle") # snowflake tina.forward(20) tina.right(120) def needs_to_be_repeated_6(): tina.left(60) tina.forward(20) tina.right(120) tina.forward(20) for x in range(0,6): needs_to_be_repeated_6() tina.left(120) tina.back(20) def also_needs_to_be_repeated_6(): tina.forward(40) tina.back(10) tina.right(60) tina.forward(10) tina.back(10) tina.left(120) tina.forward(10) tina.back(10) tina.right(60) tina.back(30) tina.right(60) for x in range(0,6): also_needs_to_be_repeated_6()

import turtle tina = turtle.Turtle() tina.shape("turtle") hose = 20 # trapTheRugbyGuy aka GoodRiddanceJerkfaces def trap(amount): # print(amount) tina.forward(hose) amount = amount-1 tina.right(35) for x in range(0,20): trap(hose)

import turtle import random tina = turtle.Turtle() tina.shape("turtle") # DrawSquare # print(random.randint(3, 9)) # def lots_of_squares(): length = random.randint(1, 100) def square(length): tina.forward(length) tina.right(90) for x in range(0,4): square(length) # for x in range(1,100): # lots_of_squares()

import turtle tina = turtle.Turtle() tina.shape("turtle") # clear sidewalk :) tina.forward(40) tina.left(90) tina.forward(10) #PD tina.forward(80) tina.right(90) tina.forward(60) tina.right(90) tina.forward(80) tina.right(90) tina.forward(60)

import turtle
tina = turtle.Turtle()
tina.shape("turtle")

# clear sidewalk :)

tina.forward(40)
tina.left(90)
tina.forward(10)

#PD
tina.forward(80)
tina.right(90)
tina.forward(60)
tina.right(90)
tina.forward(80)
tina.right(90)
tina.forward(60)
              

import turtle tina = turtle.Turtle() tina.shape("turtle") # open sesame #repeat 6 times def open_sesame(): tina.forward(50) # 15 in comic tina.right(60) open_sesame() # open_sesame() # open_sesame() # open_sesame() # open_sesame() # open_sesame() # for x in range(0,6): # open_sesame()

Example 0 - start typing and then click anywhere on the page

---

Here is the HTML:

                         <input
                         type="text"
                         placeholder="Type something here, then click outside of the field."
                         size="100"/>
                         <p id="log"></p>
                    

If the following JavaScript is in your HTML file, you need to place the code between an opening script tag and a closing script tag. For review & examples of how to use the script tag, please view this MDN page.

                         let input = document.querySelector('input');
                         let log = document.getElementById('log');
                         input.onchange = handleChange;
                         function handleChange(e) {
                            log.textContent = `The text's value is ${e.target.value.length} character(s) long.`;
                         }
              

Example 1 - watch the 2nd item when you click the button

1. i love javascript
2. i like codeclub
3. let's build cool projects

click me

---

Here is the HTML:

                        <ol>
                          <li class="main2"> i love javascript</li>
                          <li class="main2"> i like codeclub</li>
                          <li class="main2"> let's build cool projects</li>
                        </ol>
                       <button id="btn">click me</button>
                    

If the following JavaScript is in your HTML file, you need to place the code between an opening script tag and a closing script tag. For review & examples of how to use the script tag, please view this MDN page.

                 const btn = document.getElementById('btn')
                        btn.addEventListener('click', function alterItem(){
                            let main = document.getElementsByClassName("main2");
                            main[1].innerHTML = 'enough of these exercises. let\'s build a cool site already';
                        })
                

Example 2 - click the button to change the texts

Let's Make a Site About One Piece

Let's make a site about Attack on Titan

Let's Make a K-Pop fansite

click me

---

Here is the HTML:

                        <p class="p-elements">Let's Make a Site About One Piece</p>
                        <p class="p-elements">Let's make a site about Attack on Titan</p>
                        <p class="p-elements">Let's Make a K-Pop fansite</p>
                        <button id="btn2">click me</button>
                    

If the following JavaScript is in your HTML file, you need to place the code between an opening script tag and a closing script tag. For review & examples of how to use the script tag, please view this MDN page.

                  const btn2 = document.getElementById('btn2')
                      btn2.addEventListener('click', function main(){
                          let mainItem = document.getElementsByClassName('p-elements');
                          mainItem[0].innerHTML = 'MANGA!!';
                          mainItem[1].innerHTML = 'COMICS!!';
                          mainItem[2].innerHTML = 'MOVIES!!';
                      })
                

Example 3 - click to add a child element

Click me to add a child element

---

Here is the HTML:

                         <div id="parent">Is something going below this? </div>
                         <button id="button3">Click me to add a child element </button>
                    

If the following JavaScript is in your HTML file, you need to place the code between an opening script tag and a closing script tag. For review & examples of how to use the script tag, please view this MDN page.

                  const button3 = document.getElementById("button3")
                  button3.addEventListener('click', function master(){
                    const createDiv = document.createElement('div')
                    createDiv.innerHTML = 'is this child below the parent?'
                    document.getElementById("parent").appendChild(createDiv)
                        })
                

Example 4 - click the button and add some style !

This exercise requires adding an id to the body tag of the entire page - not just the HTML included in the example

Click me

---

Here is the HTML:

                          <button id="mainButton">Click me</button>
                    

This exercise requires extra sytle. Be sure to have unique id names. If you're not using an external style sheet and would like to review the style html tags, please view this MDN page.

                      <style>
                        .newP{
                             background-color: hotpink;
                         }
                         .button{
                             background-color: blueviolet;
                             width: 200px;
                             border: none;
                             font-size: 2rem;
                             padding: 0.5rem;
                             border-radius: 5px;
                             cursor: pointer;
                         }
                      </style>
                    

If the following JavaScript is in your HTML file, you need to place the code between an opening script tag and a closing script tag. For review & examples of how to use the script tag, please view this MDN page.

                    const buttonEl = document.getElementById('mainButton')
                       const bodyEl = document.getElementById('mainBody')
                       buttonEl.addEventListener('click', addFunction)

                       function addFunction(){
                       buttonEl.classList.add('button')
                       bodyEl.classList.remove('blue-ground');
                       bodyEl.classList.add('newP')
                       }