Aula 7, 8 e 9

FilosoDev · FilosoDev · commit 06d74cd2b6a9 · 2021-08-15T10:40:27.000-03:00
diff --git a/Aula-07.html b/Aula-07.html
@@ -0,0 +1,16 @@
+﻿<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    
+    <div id="idQualquer" class="outraClasseQualquer">Alguma coisa</div>
+
+
+    <script src="Aula-07.js"></script>
+</body>
+</html>
diff --git a/Aula-07.js b/Aula-07.js
@@ -0,0 +1,20 @@
+﻿//hasAttribute - pergunta se tem algum atributo
+//document.write(document.getElementById('idQualquer').hasAttribute('class'));
+
+//document.write(document.querySelector('.classeQualquer').hasAttribute('id'));
+
+//getAttribute - perguntar se tem e traz o valor
+//var atributoDiv = document.getElementById("idQualquer");
+
+// vai retornar o valor que está dentro da classe
+//document.write(atributoDiv.getAttribute('class'));
+
+
+
+
+//setAttribute - altera ou aplica o atributo
+//selecionando a div
+var atributoDiv = document.getElementById('idQualquer');
+
+// aplicando um estilo direto
+atributoDiv.setAttribute('style', 'background: blue');
diff --git a/Aula-08.html b/Aula-08.html
@@ -0,0 +1,19 @@
+﻿<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    
+    <div style="min-height: 2000px;">topo</div>
+
+    <footer>
+        <button onclick="topo()">ir para topo</button>
+    </footer>
+
+    <script src="Aula-08.js"></script>
+</body>
+</html>
diff --git a/Aula-08.js b/Aula-08.js
@@ -0,0 +1,8 @@
+﻿//scrollTo - te leva para algum lugar da página
+function topo() {
+    window.scrollTo({
+        top: 0,
+        left: 0,
+        behavior: 'smooth'
+    })
+}
diff --git a/Aula-09.html b/Aula-09.html
@@ -0,0 +1,21 @@
+﻿<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    
+    <ul>
+        <li>Item 1</li>
+        <li>Item 2</li>
+        <li>Item 3</li>
+        <li>Item 4</li>
+    </ul>
+
+
+    <script src="Aula-09.js"></script>
+</body>
+</html>
diff --git a/Aula-09.js b/Aula-09.js
@@ -0,0 +1,25 @@
+﻿// Criar um elemento <li> e o nó de texto
+// Criar o nó do texto
+//var elemento = document.createElement('li');
+//var texto = document.createTextNode('item da lista adicionado');
+//elemento.appendChild(texto);
+
+// Recuperando o elemento lista e
+//anexando o elemeno <li> ao final da lista
+//var lista = document.getElementsByTagName('ul')[0];
+//lista.appendChild(elemento);
+
+//inserBefore
+var lista = document.getElementsByTagName('ul')[0];
+var itens = lista.getElementsByTagName('li');
+
+//criando o elemento
+var elemento = document.createElement('li');
+elemento.textContent = 'outro item';
+
+// inserindo valor em posição específica
+//lista.insertBefore(elemento, itens[1]);
+
+
+// removechild
+lista.removeChild(itens[3]);
