Javascript открыть скрыть новое сообщение

Question

<script> 
 
    function closeit(){ 
 
    document.getElementById('avviso').setAttribute("style", "display:none"); 
 
} 
 
setTimeout("closeit", 3000); 
 
</script>

#avviso{ 
 
    width:200px; /* Larghezza del box */ 
 
    padding:5px; position:fixed; z-index:5000;} 
 
    .box-avviso{ 
 
    border:4px double #940F04; /* Colore del bordo */ 
 
    -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 8px 8px 6px #909090; -moz-box-shadow: 8px 8px 6px #909090; box-shadow: 8px 8px 6px #909090; 
 
    background-color: #FFEAE9; /* Colore di sfondo */ 
 
    padding: 8px; font-family: Verdana, Geneva, sans-serif; 
 
    color: #003366; /* Colore del testo */ 
 
    } 
 
    .testo-avviso { /* Stile di AVVISO */ 
 
    font-size:18pt; 
 
    font-weight:bold; 
 
    color:#B4045F; 
 
    text-shadow: 0px 0px 10px #BA55D3;}

<div id="avviso" style="left:20px; top:100px; padding:0;"> 
 
    <div align="right" style="margin-bottom:-15px;"><b> 
 
<a href="javascript:closeit()" > 
 
<font face="Arial" size="1">CHIUDI</font>&nbsp;<img valign="middle" src="https://lh6.googleusercontent.com/-80LmoXXMIi0/TnsyYeeRVnI/AAAAAAAAUgc/RShnbWF2L_c/chiudi.png" style="vertical-align:middle;" border="0"/></a></b></div> 
 
    <br/> 
 
    <fieldset class="box-avviso"> 
 
    <legend class="testo-avviso" align="center"></legend> 
 
     Nuova Comunicazione<br/> 
 
    </fieldset> 
 
    </div>

можно автоматически закрыть это окно Javascript, и создал новое сообщение с каждые 10 секунд?

Answer 1

setInterval(): Несколько раз вызывает функцию или выполняет фрагмент кода, с фиксированной задержкой по времени между каждым вызовом. Возвращает интервалID.

Да, вы можете использовать setInterval() вместо setTimeout():

setInterval(closeit, 10000); //NOTE Removing double quotes arround function name 

ПРИМЕЧАНИЯ: Вы можете использовать .style управлять CSS атрибутов вместо setAttribute():

document.getElementById('avviso').style.display="none"; 

Надеется, что это помогает ,

---

function closeit(){ 
 
    document.querySelectorAll('.box-avviso')[0].textContent = "New message"; 
 
} 
 
setInterval(closeit, 3000);

#avviso{ 
 
    width:200px; /* Larghezza del box */ 
 
    padding:5px; position:fixed; z-index:5000;} 
 
.box-avviso{ 
 
    border:4px double #940F04; /* Colore del bordo */ 
 
    -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 8px 8px 6px #909090; -moz-box-shadow: 8px 8px 6px #909090; box-shadow: 8px 8px 6px #909090; 
 
    background-color: #FFEAE9; /* Colore di sfondo */ 
 
    padding: 8px; font-family: Verdana, Geneva, sans-serif; 
 
    color: #003366; /* Colore del testo */ 
 
} 
 
.testo-avviso { /* Stile di AVVISO */ 
 
    font-size:18pt; 
 
    font-weight:bold; 
 
    color:#B4045F; 
 
    text-shadow: 0px 0px 10px #BA55D3;}

<div id="avviso" style="left:20px; top:100px; padding:0;"> 
 
    <div align="right" style="margin-bottom:-15px;"><b> 
 
    <a href="javascript:closeit()" > 
 
     <font face="Arial" size="1">CHIUDI</font>&nbsp;<img valign="middle" src="https://lh6.googleusercontent.com/-80LmoXXMIi0/TnsyYeeRVnI/AAAAAAAAUgc/RShnbWF2L_c/chiudi.png" style="vertical-align:middle;" border="0"/></a></b></div> 
 
    <br/> 
 
    <fieldset class="box-avviso"> 
 
    <legend class="testo-avviso" align="center"></legend> 
 
    Nuova Comunicazione<br/> 
 
    </fieldset> 
 
</div>