Mudar CSS de acordo com os parâmetros

[everton_araujo 1]

Olá Pessoal boa noite. Preciso da ajuda de vcs para mudar o tamanho de uma imagem dinamicamente. O parâmetro a ser utilizado é a quantidade de dias que se passaram.

 

 Esta é a parte do cálculo de dias que já está funcionando:

 

function r(f){/in/.test(document.readyState)?setTimeout('r('+f+')',9):f()}
r(function(){
    var dataini = document.querySelectorAll('#DataIni3')
    dataini = dataini[0].querySelectorAll('div');
    dataini = dataini[0].querySelectorAll('span');
    dataini = dataini[0].innerHTML;
    var datafim = document.getElementById('datafim').innerHTML;
        
    var date1 = criarData(dataini);
    var date2 = criarData(datafim);

const diffTime = (date2 - date1);
    const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
    
    document.getElementById('dias').innerHTML+= diffDays
});

function criarData(str)
{
    return new Date(str.substring(0, 4), str.substring(4, 6), str.substring(6, 8));
}

 

Aqui é a parte que estou com dificuldade. Usar o valor que retornou de diffDays e mudar o heigth utilizando o if:

var v1 = diffDays;
function mudarVela() {
            if (v1 == "2") {
document.getElementById("candle").style.height = "100px !important";
} 
else{
 }
}

O Código completo:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script>
function r(f){/in/.test(document.readyState)?setTimeout('r('+f+')',9):f()}
r(function(){
    var dataini = document.querySelectorAll('#DataIni3')
    dataini = dataini[0].querySelectorAll('div');
    dataini = dataini[0].querySelectorAll('span');
    dataini = dataini[0].innerHTML;
    var datafim = document.getElementById('datafim').innerHTML;
        
    var date1 = criarData(dataini);
    var date2 = criarData(datafim);
    
    //const diffTime = Math.abs(date2 - date1);
    //return new Date(str.substring(0, 4), str.substring(4, 6)-1, str.substring(6, 8));
    const diffTime = (date2 - date1);
    const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
    
    document.getElementById('dias').innerHTML+= diffDays
});

function criarData(str)
{
    return new Date(str.substring(0, 4), str.substring(4, 6), str.substring(6, 8));
}

    //mudar o height da vela
var v1 = diffDays;
function mudarVela() {
            if (v1 == "2") {
document.getElementById("candle").style.height = "100px !important";
} 
else{
 }
}
</script>

    <div id="dataini"></div> 
    <div id="datafim">20200618</div>
    <div id="dias">Dias: </div>

Agradeço a atenção de todos.

 

[wanderval 19]

 

 

 

var diffDays;

function r(f){
  /in/.test(document.readyState)?setTimeout('r('+f+')',9):f()
}

r(function(){
    var dataini = document.getElementById('dataini').innerHTML;
    var datafim = document.getElementById('datafim').innerHTML;
        
    var date1 = criarData(dataini);
    var date2 = criarData(datafim);
    
    const diffTime = (date2 - date1);
    diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));    
    document.getElementById('dias').innerHTML += diffDays;
    mudarVela();
});

function criarData(str)
{
    return new Date(str.substring(0, 4), str.substring(4, 6), str.substring(6, 8));
}

//mudar o height da vela
function mudarVela() {console.log(diffDays)
  if (diffDays === 2) {
    // document.getElementById("candle").style.height = "100px";
    document.getElementById("candle").style.setProperty("height", "100px", "important");
  } 
}

https://jsbin.com/xisekeqido/edit?html,js,output