Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.

Link zu der Vergleichsansicht

Beide Seiten, vorherige Überarbeitung Vorherige Überarbeitung
Nächste Überarbeitung
Vorherige Überarbeitung
gf_informatik:web:js [2025-11-01 11:01] – [Auftrag: Dies und das] hofgf_informatik:web:js [2025-11-01 11:03] (aktuell) – [JavaScript Basics] hof
Zeile 46: Zeile 46:
 while (i < 10) { while (i < 10) {
     console.log(i)     console.log(i)
 +    i = i + 1
 } }
  
Zeile 208: Zeile 209:
 // SCHNAPS-BIER-SIRUP // SCHNAPS-BIER-SIRUP
 function handleKeyPressSBS(event) { function handleKeyPressSBS(event) {
-    let inpAge = document.getElementById("inputAge"); +    let inpAge = document.getElementById("inputAge"
-    let drink = document.getElementById('spanDrink');+    let drink = document.getElementById('spanDrink')
  
-    let age = inpAge.value;+    let age = inpAge.value
  
     if (age >= 18) {     if (age >= 18) {
-        drink.textContent = "Schnaps!";+        drink.textContent = "Schnaps!"
     } else if (age >= 16) {     } else if (age >= 16) {
-        drink.textContent = "Bier!";+        drink.textContent = "Bier!"
     } else {     } else {
-        drink.textContent = "Sirup!";+        drink.textContent = "Sirup!"
     }     }
 } }
  
 // CLICKER // CLICKER
-let count = 0;+let count = 0
  
 function handleBtnClicker(event) { function handleBtnClicker(event) {
-    count += 1; +    count += 1 
-    let spanClick = document.getElementById("spanClicker"); +    let spanClick = document.getElementById("spanClicker"
-    spanClick.textContent = count;+    spanClick.textContent = count
 } }
  
-let funCount = 0; +let funCount = 0 
-const funProb = 0.1;+const funProb = 0.1
  
 function handleBtnFunClicker(event) { function handleBtnFunClicker(event) {
-    funCount = funCount + 1; +    funCount = funCount + 1 
-    const randFloat = Math.random();+    const randFloat = Math.random()
     if(randFloat < funProb){     if(randFloat < funProb){
-        funCount = 0;+        funCount = 0
     }     }
-    spanFunClicker.textContent = funCount;+    spanFunClicker.textContent = funCount
 } }
  
 // DICE // DICE
-const l = 200;+const l = 200
 const diceImages = [ const diceImages = [
     [[0.5*l, 0.5*l]],     [[0.5*l, 0.5*l]],
Zeile 254: Zeile 255:
 ] ]
  
-function handleBtnDice(event){ +function handleBtnDice(event) { 
-    let randomInt = Math.floor(Math.random() * 6) + 1; +    let randomInt = Math.floor(Math.random() * 6) + 1 
-    spanDice.textContent = randomInt;+    spanDice.textContent = randomInt
  
     // draw dice     // draw dice
-    const ctx = canvasDice.getContext('2d'); +    const ctx = canvasDice.getContext('2d'
-    canvasDice.width = l; +    canvasDice.width = l 
-    canvasDice.height = l;+    canvasDice.height = l
          
-    ctx.clearRect(0, 0, canvasDice.width, canvasDice.height)// Clear the canvas+    ctx.clearRect(0, 0, canvasDice.width, canvasDice.height) // Clear the canvas
  
     // Draw the dice outline     // Draw the dice outline
-    ctx.strokeStyle = 'black'; +    ctx.strokeStyle = 'black' 
-    // ctx.lineWidth = 5; +    // ctx.lineWidth = 5 
-    const diceImage = diceImages[randomInt-1];+    const diceImage = diceImages[randomInt-1]
     diceImage.forEach(point => {     diceImage.forEach(point => {
-        ctx.beginPath(); +        ctx.beginPath() 
-        ctx.arc(point[0],point[1], 20, 0, 2 * Math.PI); +        ctx.arc(point[0],point[1], 20, 0, 2 * Math.PI) 
-        ctx.fill(); +        ctx.fill() 
-        ctx.stroke()// Outline the circle +        ctx.stroke() // Outline the circle 
-        ctx.closePath(); +        ctx.closePath() 
-    });+    })
 } }
  
 // CHAR COUNTER // CHAR COUNTER
 function handleInputTextArea(event) { function handleInputTextArea(event) {
-    let txtArea = document.getElementById("txtArea"); +    let txtArea = document.getElementById("txtArea"
-    let spanBuchstaben = document.getElementById("spanBuchstabenCounter"); +    let spanBuchstaben = document.getElementById("spanBuchstabenCounter"
-    spanBuchstaben.textContent = txtArea.value.length;+    spanBuchstaben.textContent = txtArea.value.length
 } }
  
 // DATE // DATE
 function handleDateSelected(event) { function handleDateSelected(event) {
-    const inpDate = document.getElementById('inputDate'); +    const inpDate = document.getElementById('inputDate'
-    const dateSelected = inpDate.value;+    const dateSelected = inpDate.value
  
     // get date of today     // get date of today
-    const today = new Date(); +    const today = new Date() 
-    const year = today.getFullYear() // Get the current year (e.g., 2023) +    const year = today.getFullYear()  // Get the current year (e.g., 2023) 
-    const month = today.getMonth() + 1 // Get the current month (January is 0) +    const month = today.getMonth() + 1  // Get the current month (January is 0) 
-    const day = today.getDate() // Get the current day of the month+    const day = today.getDate()  // Get the current day of the month
  
-    const dateToday = `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`; // Format the date (e.g., YYYY-MM-DD)+    // Format the date (e.g., YYYY-MM-DD) 
 +    const dateToday = `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`
        
     // create date objects     // create date objects
-    const start = new Date(dateSelected); +    const start = new Date(dateSelected) 
-    const end = new Date(dateToday);+    const end = new Date(dateToday)
  
     // determine difference     // determine difference
-    const deltaMs = end - start; +    const deltaMs = end - start 
-    const deltaDays = Math.floor(deltaMs / (1000 * 60 * 60 * 24));+    const deltaDays = Math.floor(deltaMs / (1000 * 60 * 60 * 24))
  
-    const passedDays = document.getElementById('spanPassedDays'); +    const passedDays = document.getElementById('spanPassedDays'
-    passedDays.textContent = deltaDays;+    passedDays.textContent = deltaDays
 } }
 </code> </code>
  • gf_informatik/web/js.1761994873.txt.gz
  • Zuletzt geändert: 2025-11-01 11:01
  • von hof