Henrique

22/11/2020

Modificando HTML #01

<!DOCTYPE html>
<html>

<head>
    <meta charset='UTF-8'>
    <title>Modificando HTML #01</title>
    <link rel='stylesheet' href='css/estilo.css'>
</head>

<body class='conteudo exercicio'>
    <script>
        const body = document.querySelector('body')

        const div1 = document.createElement('div')
        div1.classList.add('destaque')
        div1.innerHTML = 'Primeiro'

        const div2 = document.createElement('div')
        div2.setAttribute('wm-atributo', 'valor')
        div2.innerHTML = 'Segundo'

        const p = document.createElement('p')//fazendo um parágrafo
        p.innerHTML = 'Terceiro'
        const div3 = document.createElement('div');
        div3.appendChild(p)//paragrafo dentro da função

        //exibindo no navegador
        body.appendChild(div1)
        body.appendChild(div2)
        body.appendChild(div3)

        const texto = document.createTextNode('Antes...')
        //div3 = elemento PAI, texto = elemento FILHO
        div3.insertBefore(texto, div3.childNodes[0])//insere antes da posição 1

        //Adicionando um clone
        const div4 = div3.cloneNode(true)//clonou o elemento 3 e coloca na div4
        body.appendChild(div4);//adiciona o elemento clonado
        body.removeChild(div3);//revovendo a div3

    </script>
</body>

</html>

Formulário de análise em Excel VBA #01

Código1 feito na Visual Macro

Sub relatorio()

Dim produtos_vendidos As Long

Dim produtos_totais As Long

produtos_vendidos = WorksheetFunction.CountIf(Plan3.Columns("c"), "SIM")

produtos_totais = WorksheetFunction.CountA(Plan3.Columns("a")) - 1

UserForm1.txtotais.Value = produtos_totais

UserForm1.txvendidos.Value = produtos_vendidos

MsgBox "ANÁLISE REALIZADA !", vbInformation, ""

End Sub

Fazendo formulário em Excel VBA #03

Excel 2010

Código utilizado:

Private Sub ToggleButton1_Click()

'variáveis

Dim num1 As Long

Dim num2 As Long

'atribui valor que estiver na caixa de texto

num1 = Me.tx1.Value

num2 = Me.tx2.Value

Me.txResultado.Value = num1 * num2

MsgBox "Operação realizada com sucesso"

End Sub

21/11/2020

Fazendo um formulário em Excel VBA #02

Excel 2010

Fazendo um formulário em Excel VBA #01

Excel 2010

Relógio em LCD com PIC 16F628A

Software Proteus versão: 7.6

Código feito em CCS C Compiler

#include <16f628a.h>

#fuses intrc_io,nowdt,nomclr//fuse bits

#use delay (clock= 8MHz)

#define use_portb_lcd TRUE

#include <lcd.c>

void main(void{

//variáveis

int HORA=23, MINUTO=35, SEGUNDO=0;

output_a(0x0f);

output_b(0x00);

lcd_init();

while(true){

SEGUNDO ++;

if (SEGUNDO > 59 || input(pin_A0)){//reset

SEGUNDO = 0;

MINUTO ++;

}

if (MINUTO > 59 || input(pin_A1)){

MINUTO = 0;

HORA ++;

}

if (HORA > 23) HORA = 0;

printf(lcd_putc,"\f %02u:%02u:%02u\nENG. COTIDIANA", HORA, MINUTO, SEGUNDO);

delay_ms(1000);

}

Créditos para Alexando Lima

Acessando classes em HTML

<!DOCTYPE html>
<html>

<head>
    <meta charset='UTF-8'>
    <title>Acessando Classes</title>
    <link rel='stylesheet' href='css/estilo.css'>
</head>

<body class='conteudo exercicio'>
    <div>
        Classes
    </div>
    <script>
        const div = document.querySelector('div')//consegue adicionar, remover, acessar
        const classes = div.classList//
        classes.add('destaque')
        classes.remove('destaque')
        classes.toggle('destaque')//se não exixtir ele adiciona, se existir ele remove
        console.log(classes.contains('destaque'))//true
        classes.add('Blog')
        console.log(classes.length)//tamanho da classe
        classes.toggle('destaque')
        console.log(classes.length)

        classes.add('destaque1')
        classes.add('destaque2')
        console.log(classes.length)

        classes.add('destaque1')
        classes.add('destaque2')
        console.log(classes.length)

        for(let c of classes) {
            console.log(c)
        }
    </script>
</body>

</html>

Acessando atributos em HTML

<!DOCTYPE html>
<html>

<head>
    <meta charset='UTF-8'>
    <title>Acessando Atributos #03</title>
    <link rel='stylesheet' href='css/estilo.css'>
</head>

<body class='conteudo exercicio'>
    <div>
        <ul id="compras" destino='escritório' data-urgencia="5">
            <li>Café</li>
            <li>Água</li>
            <li>Copo Descartável</li>
        </ul>
    </div>
    <script>
        const lista = document.querySelector('#compras')

        // somente leitura
        console.log(lista.attributes)
        console.log(lista.attributes[0]);
        console.log(lista.attributes.id);
        console.log(lista.attributes[1]);
        console.log(lista.attributes.destino);
        console.log(lista.attributes['data-urgencia']);
        lista.attributes.destino = 'casa'
        console.log(lista.attributes.destino);

    </script>
</body>

</html>

15/11/2020

Acessando os atributos #01 em HTML

<!DOCTYPE html>
<html>

<head>
    <meta charset='UTF-8'>
    <title>Acessando Atributos #01</title>
    <link rel='stylesheet' href='css/estilo.css'>
</head>

<body class='conteudo exercicio'>
    <div>
        <a href='https://www.cod3r.com.br'>Cod3r</a>
    </div>
    <div id='primeiro'>
        <img src='http://files.cod3r.com.br/curso-web/logo-estreita.png' alt='logo'>
    </div>
    <script>
        const img = document.querySelector('img')
        //acessando os atributos de img através de uma string
        console.log('getAttribute', img.getAttribute('src'))
        //acessando os atributos através do nome 
        console.log('src', img.src)
        console.log('["src"]', img['src'])//
        console.log('alt', img.alt)

        console.log('Elemento "img"...............')
        console.log('NodeType', img.nodeType)
        console.log('NodeName', img.nodeName)

        const src = img.getAttributeNode('src')
        console.log('Atributo "src"...............')
        console.log('NodeType', src.nodeType)
        console.log('NodeName', src.nodeName)
        console.log('NodeValue', src.nodeValue)

        const link = document.querySelector('a')
        console.log('Elemento "a"...............')
        console.log('href', link.href)
        console.log('firstChild.nodeType', link.firstChild.nodeType)
        link.firstChild.nodeValue = 'Novo Texto'
    </script>
</body>

</html>

Saída gerada

Sintetizador de voz com Macro em Excel VBA

Excel 2010

Private Sub UserForm_Activate()

Dim hora As String

Dim qtprodutosnv As Long

qtprodutosnv = WorksheetFunction.CountIf(Plan1.Columns(3), "NÃO")

'Irá capturar a data atual

hora = Format(Now, "hh:mm")

'sintetizador de voz

Application.Speech.Speak ("OLÁ MUNDO !")

'Avisa a hora atual em voz

Application.Speech.Speak ("AGORA SÃO " & hora)

'Emite a voz dizendo a quantidade de produtos para vender

Application.Speech.Speak ("VOCE POSSUI " & qtprodutosnv & "PRODUTOS PARA VENDER EM SEU ESTOQUE !")

'fechando o formulário

End Sub

Mensagem com box em Excel VBA

Excel 2010

Sub testes()

MsgBox "OPERAÇÃO REALIZADA COM SUCESSO !", vbInformation

MsgBox "ERRO !", vbCritical

MsgBox "ALERTA !", vbExclamation

'2° parte superior da caixa

MsgBox "CUIDADO !", vbExclamation, "SISTEMA DE GESTÃO 4.0"

End Sub

Loop para remover formulas no Excel VBA

Excel 2010

Sub retirar()

Plan1.Range("E2:F31").Select

For Each x In Selection

x.Value = x.Value

MsgBox "OPERAÇÃO REALIZADA !"

End Sub

Impressão, atalhos, ocultar e esconder planilha no Excel VBA

Excel 2016

Sub imprimir()

'imprimindo os conteúdos da planilha 3

Plan3.PrintOut

MsgBox "PLANILHAS IMPRIMIDAS COM SUCESSO !"

End Sub

'Método para ocultar

Sub ocultar()

Plan1.Visible = False

End Sub

'Método para exibir

Sub desocultar()

Plan1.Visible = True

End Sub

14/11/2020

Estrutura Condicional em Excel VBA

Excel 2016

Sub relatorio()

Dim vtotal As Long

Dim ltotal As Long

For contlinhas = 2 To 20

vtotal = Cells(contlinhas, 2).Value

ltotal = Cells(contlinhas, 3).Value

Cells(contlinhas, 4).Value = vtotal - ltotal

For contlinhas = 2 To 20

vtotal = Cells(contlinhas, 2).Value

ltotal = Cells(contlinhas, 3).Value

Cells(contlinhas, 4).Value = vtotal - ltotal

Cells(contlinhas, 5).Value = ltotal / vtotal

If ltotal / vtotal > 0.55 Then

Cells(contlinhas, 6).Value = "SIM"

Else

Cells(contlinhas, 6).Value = "NÃO"

End If

End Sub

13/11/2020

Estrutura de repetição FOR em Excel VBA

Excel 2010

Sub relatorio()

Dim vtotal As Long

Dim ltotal As Long

For contlinhas = 2 To 20

vtotal = Cells(contlinhas, 2).Value

ltotal = Cells(contlinhas, 3).Value

Cells(contlinhas, 4).Value = vtotal - ltotal

For contlinhas = 2 To 20

vtotal = Cells(contlinhas, 2).Value

ltotal = Cells(contlinhas, 3).Value

Cells(contlinhas, 4).Value = vtotal - ltotal

Cells(contlinhas, 5).Value = ltotal / vtotal

End Sub

10/11/2020

Variáveis em Excel VBA

Excel 2010

Sub testarVariaveis()

Dim nome As String

Dim idade As Integer

nome = "Henrique"

idade = 34

MsgBox ("seu nome é: " & nome & " Sua idade = " & idade & " anos")

End Sub

05/11/2020

Método End em Excel VBA

Private Sub Worksheet_SelectionChange(ByVal Target As Range)

ActiveCell.End(xlDown).Select

End Sub

________//________

Private Sub Worksheet_SelectionChange(ByVal Target As Range)

ActiveCell.End(xlUp).Select

End Sub

04/11/2020

Método Offset em Excel VBA

Private Sub Worksheet_SelectionChange(ByVal Target As Range)

ActiveCell.Offset(1, 0).Value = "Abaixo"

ActiveCell.Offset(-2, 1).Value = "Abaixo"

End Sub

03/11/2020

Selecionar elementos em HTML #02

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Selecionar Elementos #02</title>
    <link rel="stylesheet" href="css/estilo.css">
</head>
<body class="conteudo exercicio">
    <div id="primeiro">#primeiro</div>
    <div wb-attrib>Segundo</div>
    <div class="ultimo terceiro"><span wb-attrib>.terceiro .ultimo</span></div>
    <script>              
        document.querySelector('#primeiro').classList.add('destaque')//esperar selecionar um seletor
        //selecionar vários
        const selecionar = seletor => 
            document.querySelectorAll(seletor).forEach(e => e.classList.add('destaque'))//retorna uma classe de lista

            //função para deselecinar
            const descelecionar = seletor => 
                document.querySelectorAll(seletor).forEach(e => e.classList.remove('destaque'))

            selecionar('div')//selecionar tudo que tem div
            
            descelecionar('*')//deseleciona tudo o que foi selecionado
            selecionar('.terceiro.ultimo')//seleciona esse elemento
            descelecionar('*')
            selecionar(':not(#primeiro)')//tudo que não e primeiro será selecionado

            descelecionar('*')
            selecionar(':nth-child(1)')//seleciona o primeiro filho de algum elemento

            descelecionar('*')
            selecionar('div:nth-of-type(1)')//seleciona o primeiro elemento do tipo div
    </script>
</body>
</html>

Eventos da planilha com Excel VBA #01

Excel 2010

Private Sub Worksheet_SelectionChange(ByVal Target As Range)

ActiveCell.Value = "ALTERADO"

End Sub

Excel 2010

Private Sub Worksheet_SelectionChange(ByVal Target As Range)

MsgBox Target.Address

MsgBox Target.Row

MsgBox Target.Column

End Sub

Funções na planilha com Excel VBA #02

Excel 2010

Sub total()

Range("f3").Value = WorksheetFunction.CountA(Plan1.Columns("a")) - 1

Range("g3").Value = WorksheetFunction.Sum(Plan1.Columns("b"))

Range("h3").Value = WorksheetFunction.Sum(Plan1.Columns("c"))

End Sub

02/11/2020

Funções na planilha com macro no Excel VBA #01

Sub total()

Range("g3").Value = WorksheetFunction.CountA(Plan1.Columns("a")) - 1

End Sub

Função com macro no Excel VBA

Gravação de macros no Excel VBA

01/11/2020

Selecionar elementos em HTML #01

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Selecionar Elementos #01</title>
    <link rel="stylesheet" href="css/estilo.css">
</head>
<body class="conteudo exercicio">
    <div id="primeiro">#primeiro</div>
    <div>Segundo</div>
    <div class="terceiro ultimo">.terceiro .ultimo</div>
    <script>
        document.getElementById('primeiro').classList.add('destaque');/*passa um id*/
    
        const divs = document.getElementsByTagName('div')//vai pegar 1 único elemento div

        Array.from(divs).forEach(e => e.classList.remove('destaque'))
        // tranforma um HTML em 1 array de coleção
        const divsArray = [...divs]
        divsArray.forEach(e => e.classList.add('destaque'))

        const ultimosElementos = document.getElementsByClassName('ultimo');
        // 
        for(let e of ultimosElementos){
            e.classList.remove('destaque')//remove destaque
        }
    </script>
</body>
</html>

Gerador de código

(a + b) * (c + d) -e

MÉTODO 1

1- Movido a em R0, e o resultado é armazenado em R0

2- Adicionado b a R0 (como R0 contém a) e o resultado é armazenado em R0

3- Agora vamos armazenar R0 (a + b) em T1 e R0 se tornará livre

4- Aqui nós movemos c em R0

5- Vamos adicionar d a R0 (como R0 agora contém c) e o resultado é armazenado em Ro

6- Agora multiplicamos T1 (a + b) por Ro (agora contém c + d) e o resultado é armazenado em Ro

7- Aqui nós nutrimos e de Ro

8- O resultado é armazenado em T4 de R0

MÉTODO 2

1- Movido a em R0, e o resultado é armazenado em R0

2- Adicionado b a R0 (como R0 contém a) e o resultado é armazenado em R0

3- Aqui nós movemos c em R1

4- Vamos adicionar d a R1 (como R1 agora contém c) e o resultado é armazenado em Ro

5- Agora multiplicamos Ro (a + b) por R1 (já que Ro agora contém c + d) e o resultado é armazenado em R0 (Ro + Ro)

6- Aqui subtraímos e de R1

7- O resultado é armazenado em T4 de R1

CSS com grid em HTML 03

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>CSS Grid #03</title>
    <link rel="stylesheet" href="css/tag.css">
    <style>
        *{
            padding: 0;
            margin: 0;/*margem*/
        }

        header{
            grid-area: cabecalho;
        }

        nav{
            grid-area: navegacao;
        }

        main{
            grid-area: conteudo;
        }

        footer{
            grid-area: rodape;
        }

        body{
            display: grid;
            min-height: 100vh;/*ocupa a altura iteira*/
            grid-template-columns: 300px 1fr;/* 1° coluna vai ser 300px e a 2° vai ocupar o espaço inteiro da tela*/
            grid-template-rows: 100px 1fr 100px;
            /*organização dos elementos na tela*/
            grid-template-areas:
            'cabecalho cabecalho'
            'navegacao conteudo'
            'rodape rodape'
            ;
        }
        /*  */
        @media(max-width: 700px){
            body{
                grid-template-columns: 1fr;
                grid-template-rows: 80px 1fr 100px;/*1fr= 1 frame, 100px= o máximo possível da tela*/
                grid-template-areas:
                
                'navegacao'
                'conteudo'
                'rodape';
            }

            header{/* cabecalho*/
                display: none;
            }
        }

        header{
            display: none;
        }
    </style>
</head>

<body>
    <main class="tag">CONTEÚDO</main>
    <header class="tag">CABEÇALHO</header>
    <footer class="tag">RODAPÉ</footer>
    <nav class="tag">NAVEGAÇÃO</nav>

    <script src="js/tag.js"></script>
</body>

</html>

Software: Visual Studio Code

CSS com grid em HTML 02

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>CSS Grid #02</title>
    <style>
        html,
        body {
            margin: 20px;
            height: calc(100% - 40px);/*calcula a altura para 100%*/
            background-color: lightgray;/*cor de fundo cinza*/
        }
        
        div {
            display: flex;
            align-items: center;
            justify-content: center;/*quando a div aumentar ela ficará no meio*/
            font-size: 30px;
            border: solid 5px dodgerblue;/*borda azul*/
            background: #fff;
        }

        body{
            display: grid;/*ocupa a tela inteira*/
            /* nome das linhas 'só irá aparecer o nome das linhas no navegador FireFox' */
            /*repete 3 colunas e 3 linhas com 1 fragmento*/           
            grid-template-columns: 
            [linha1] 1fr
            [metade-1 meio-1]
            1fr [metade-2 meio2]
            1fr [fim];
            grid-template-rows: repeat(3, 1fr);
            
            grid-column-gap: 20px;/*espaço de 20px no eixo da coluna*/
            grid-row-gap: 20px;/*espaço de 20px no eixo da linha*/
            grid-gap: 50px 10px;/*espaço de 50px na linha e 10px na coluna*/
            grid-gap: 10px;/*espaço geral para linha e coluna de 10px*/
        }

        .d1{
            grid-column-start: metade-2;
            grid-column-end: fim;
            grid-column: meio-1 / fim;/*entre meio 1 e o final*/
            grid-area: 1 / meio-1 / span 3 / fim;
        }
    </style>
</head>

<body>
    <div class="d1">1</div>
    <div class="d2">2</div>
    <div class="d3">3</div>
</body>

</html>

Software: Visual Studio Code

Pesquisar neste blog

22/11/2020

21/11/2020

15/11/2020

14/11/2020

13/11/2020

10/11/2020

05/11/2020

04/11/2020

03/11/2020

02/11/2020

01/11/2020

Marcadores

Translate