如何更改javascript計算的字體，顏色，大小等？

我已經看了很多關於該網站的問題，但他們似乎並沒有針對我的類似問題。如何更改javascript計算的字體，顏色，大小等？

我有一個用Javascript編寫的倒計時器，它產生一個星期，幾天，幾小時等數組並計算每一秒。我在Countdown.js的代碼是：

var countdown = function(end, elements) { 
var _second = 1000, 
    _minute = _second * 60, 
    _hour = _minute * 60, 
    _day = _hour * 24, 
    _week = _day * 7, 

    end = new Date(end), 
    timer, 

    calculate = function() { 

     var now = new Date(), 
      remaining = end.getTime() - now.getTime(), 
      data; 

     if(remaining <= 0) { 
      clearInterval(timer); 

      if(typeof callback === 'function') { 
       callback(); 
      } 
     } else { 
      if(!timer) { 
       timer = setInterval(calculate, _second); 
      } 

      data = { 
      'weeks' : Math.floor(remaining/_week), 
      'days' : Math.floor((remaining % _week)/_day), 
      'hours' : Math.floor((remaining % _day)/_hour), 
      'minutes' : Math.floor((remaining % _hour)/_minute), 
      'seconds' : Math.floor((remaining % _minute)/_second) 
     } 

     if(elements.length) { 
      for(x in elements) { 
       var x = elements[x]; 
       document.getElementById(x).innerHTML = data[x]; 
     } 
     } 

     } 


    }; 

calculate(); 
}

我想我必須做出一些改變

if(elements.length) { 
      for(x in elements) { 
       var x = elements[x]; 
       document.getElementById(x).innerHTML = data[x];

，但不知道如何作爲數據[X]擋道。

的HTML我index.html中，涉及到是這樣的：

<script src="Countdown.js"></script> 
<script> 
countdown('06/03/2017 03:00:00 PM', ['weeks', 'days', 'hours', 'minutes', 'seconds'] , function() { 
console.log('finished!')  
}); 
</script>

和周，天等，都在他們的個人DIVS這樣的：

<div style="width: 14%; padding-bottom: 14%; background-color: rgba(141,155,112,0.5); float: left;"><span id="weeks">00</span></div>

任何變化我對HTML做的事情不會隨着Javascript的接管而停止，並且字體會恢復正常。另外，我想使用非標準字體，所以有沒有一種使用Javascript的@ font-face的方法？

來源

2016-11-19 Ross Freeman

中的JavaScript已包含在問題完全不會有什麼改變字體，顏色，大小，字型或定時的任何其他視覺方面。看起來這些東西是由div的風格控制的。 – Tibrogargan

謝謝@Tibrogargan，JS只是我的整個文件來顯示我有什麼。我沒有添加任何改變樣式的嘗試。 –

你不明白。你發佈的內容與你所說的你想說的無關。這段代碼不會「接管」任何東西。 – Tibrogargan

我沒有得到任何線索你的JavaScript代碼如何改變你的風格。但你可以通過javascript添加font-face。

創建FontFace對象

var f = new FontFace("fingerpaint", "url(fingerpaint-regular-webfont.ttf)", {});

添加字體到頁面

之前，我們可以將字體添加到文檔中，我們必須顯式地迫使它裝載（什麼否則？）load（）方法。

f.load().then(function (loadedFace) { 
    document.fonts.add(loadedFace); 
});

使用FontFace

document.body.style.fontFamily = "fingerpaint";

檢查這個link以供參考。

希望這有助於:)

來源

2016-11-19 05:25:40

謝謝@mr。7 - 如果我只想爲倒計時提供這種字體，我在哪裏將它放在我的JS上面？ –

如何更改javascript計算的字體，顏色，大小等？

回答

相關問題