Advertisement
fcamuso

Javascript Lezione 52

Jun 24th, 2022
644
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html lang="EN">
  3. <head>
  4.     <meta charset="utf-8">
  5.     <title>DOM</title>
  6.  
  7.     <link rel="stylesheet" href="style.css">
  8.  
  9.     <style>
  10.         img {width: 50px; height: 50px;}
  11.         td {border: 1px solid black;}
  12.         .testoRosso {color: red;}
  13.         .sfondoGiallo {background-color: yellow;}
  14.         .font35 {font-size: 35px;}
  15.         .font25 {font-size: 25px;}
  16.         span {font-size: 25px;}
  17.     </style>
  18.  
  19. </head>
  20. <body>
  21.     <div id='div1'>
  22.         <p id="p1" class="testoRosso sfondoGiallo">primo paragrafo</p>
  23.         <p id="p2">secondo paragrafo
  24.                    <img id="img1" src="teatro1.png">
  25.                    <img id="img2" src="teatro2.png">
  26.         </p>
  27.     </div>
  28.  
  29.     <div id='div2'>
  30.         <a href="https://www.bbc.com">sito bbc</a>
  31.     </div>
  32.  
  33.     Londra <input class="c1" type="checkbox" name="capitali" id="cb1">
  34.     Parigi <input class="c1" type="checkbox" name="capitali" id="cb2">
  35.     Roma   <input type="checkbox" name="capitali" id="cb3">
  36.     Madrid <input type="checkbox" name="capitali" id="cb4"> <br>
  37.  
  38.     Conferma operazione critica: <input type="text" name="conferma" id="conferma" value="NO">
  39.     <img id='gatto' src="../drop_down_form/gatto.jpg" tipoImmagine="natura, animali">
  40.  
  41.      <!-- innerText   innerHTML  textContent -->
  42.      <br>
  43.      <span id="span1">inizio <span style="display: normal;">centrale</span>fine </span>
  44.  
  45.      <input type="text" id="descrizione" value="valore_iniziale">
  46.  
  47.     <script>
  48.         const immagine = document.getElementById('gatto');
  49.    
  50.         console.log(immagine.hasAttribute('tipoImmagine'));
  51.         immagine.removeAttribute('tipoImmagine');
  52.         console.log(immagine.hasAttribute('tipoImmagine'));
  53.  
  54.         const par1 = document.getElementById('p1');
  55.         //par1.className+= " font35";
  56.  
  57.         par1.classList.add('font35');
  58.         par1.classList.remove('testoRosso');
  59.         par1.classList.replace('font35', 'font25');
  60.         console.log(par1.classList.contains('font25'));
  61.         par1.classList.toggle('font25');
  62.         par1.classList.toggle('font25');
  63.  
  64.         const span = document.getElementById('span1');
  65.         console.log("innerHTML: "+span.innerHTML);
  66.         //span.innerHTML = "<img src='../drop_down_form/gatto.jpg'>";
  67.         //span.innerText = "<img src='../drop_down_form/gatto.jpg'>";
  68.         console.log("innerText: "+span.innerText);
  69.         console.log("textContent: "+span.textContent);
  70.  
  71.         const input = document.getElementById('descrizione');
  72.         input.value ="valore_modificato";
  73.         console.log(input.getAttribute('value'));
  74.  
  75.     </script>
  76. </body>
  77. </html>
Advertisement
RAW Paste Data Copied
Advertisement