標籤: resolution

這張梗圖很有趣:

(source: https://www.facebook.com/bitmovin/photos/a.454938237852624/1884408724905561/)

但利用 javascript 如何實作呢? 是個實用的小題目, 來看看程式吧:

html:

<h2>720p</h2>
<div class="result"></div>

<h2>1080p</h2>
<div class="result"></div>

<h2>1080i</h2>
<div class="result"></div>

<h2>4k</h2>
<div class="result"></div>


javascript:

 var els = document.getElementsByClassName("result");

 for (var i = 0; i < els.length; i++) {
     var arr = els[i].previousElementSibling.innerHTML.match(/(\d+)(\w+)/i);

     els[i].innerHTML = arr[2].repeat(arr[1]);
 }

執行結果:
https://codepen.io/timhuang/pen/MVoOdK