Chame a função no .innerHTML
selecionando a classe com document.querySelector(".dataAtual")
:
function getData(){
// var dataAtual = document.getElementsByClassName("dataAtual");
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0!
var yyyy = today.getFullYear();
if (dd < 10) {
dd = '0' + dd;
}
if (mm < 10) {
mm = '0' + mm;
}
today = dd + '/' + mm + '/' + yyyy;
return (today);
}
document.addEventListener("DOMContentLoaded", function(){
document.querySelector(".dataAtual").innerHTML = getData();
});
<table>
<th scope="row">Data Abertura</th>
<td class="dataAtual">AQUI</td>
</table>
Mas faça isso dentro do evento DOMContentLoaded
, que é disparado após o carregamento do DOM (elementos da página).
O seu código var dataAtual = document.getElementsByClassName("dataAtual");
não dá certo porque irá selecionar todos os elementos com a classe dataAtual
criando um nodelist, e não um elemento específico. Pode remover do código essa linha.
Ou você pode fazer do seguinte modo, adicionando o índice [0]
ao document.getElementsByClassName
, considerando que só existe 1 elemento com essa classe na página (se houver mais de 1, irá pegar apenas o primeiro):
function getData(){
var dataAtual = document.getElementsByClassName("dataAtual")[0];
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0!
var yyyy = today.getFullYear();
if (dd < 10) {
dd = '0' + dd;
}
if (mm < 10) {
mm = '0' + mm;
}
today = dd + '/' + mm + '/' + yyyy;
dataAtual.innerHTML = today;
return (today);
}
document.addEventListener("DOMContentLoaded", getData);
<table>
<th scope="row">Data Abertura</th>
<td class="dataAtual">AQUI</td>
</table>