html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="estilo.css">
</head>
<body>
<h1 class="titulo">Alerta!</h1>
<p class="intro"> Um paragráfo!</p>
<h2 class="subTitulo">Aviso!</h2>
<p class="corpo"> Um outro paragráfo!</p>
<script src="aula3_cap8.js"></script>
</body>
</html>
javascript:
var titulo = document.querySelector(".titulo");
var subTitulo = document.querySelector(".subTitulo");
var intro = document.querySelector(".intro");
var corpo = document.querySelector(".corpo");
titulo.classList.add("titulos");
conteudoTitulo = titulo.textContent;
// Mais algumas linhas de código js...
subTitulo.classList.add("titulos");
if(conteudoTitulo == "Alerta!"){
intro.classList.add("mensagemImportante");
}
console.log(conteudoTitulo);
// Mais algumas linhas de código js...
if(subTitulo.textContent == "Aviso!"){
corpo.classList.add("mensagemImportante");
}
css:
.titulos{
color: lightcoral;
}
.mensagemImportante {
(o erro esta aqui no comentário do css)
//alteração de apenas uma linha!
color: orange;
}