Olá Jorge! Tudo bem?
Sim, é totalmente possível integrar JavaScript com HTML e CSS. Na verdade, essa é uma das combinações mais comuns no desenvolvimento web. O HTML é usado para estruturar o conteúdo da página, o CSS para estilizar e o JavaScript para adicionar interatividade e manipular o comportamento da página.
No seu caso, você pode usar o JavaScript para manipular elementos HTML, responder a eventos do usuário, como cliques ou teclas pressionadas, e atualizar o conteúdo da página dinamicamente.
Por exemplo, você pode ter um formulário em HTML onde os usuários inserem dados de uma negociação. Com JavaScript, você pode capturar esses dados, criar uma instância da sua classe listaNegociações
e adicionar a negociação à lista. Depois, ainda com JavaScript, você pode atualizar a exibição na página para mostrar a lista de negociações.
Aqui está um exemplo básico de como você pode começar a integrar:
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lista de Negociações</title>
<style>
/* Aqui você pode adicionar seu CSS */
</style>
</head>
<body>
<h1>Minhas Negociações</h1>
<ul id="lista-negociacoes">
<!-- As negociações serão listadas aqui -->
</ul>
<script>
class listaNegociações {
constructor() {
this._negociações = [];
}
adiciona(negociação) {
this._negociações.push(negociação);
}
get Negociações() {
return [].concat(this._negociações);
}
}
const lista = new listaNegociações();
lista.adiciona('Negociação 1');
lista.adiciona('Negociação 2');
const ul = document.getElementById('lista-negociacoes');
lista.Negociações.forEach(negociacao => {
const li = document.createElement('li');
li.textContent = negociação;
ul.appendChild(li);
});
</script>
</body>
</html>
Neste exemplo, estamos criando uma lista de negociações e exibindo cada uma delas em um elemento <ul>
na página HTML. Você pode expandir isso para incluir formulários de entrada e mais estilos com CSS.
Espero ter ajudado e bons estudos!
Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓.