javascript - コンピューター上のフォントで一覧表示する

Question

そのため、作成した選択リストで別のフォントを選択すると変更されるテキストを含む div があります。現時点では、自分でフォントを追加する必要があるため、リストはかなり限られています。

ユーザーのコンピューターにインストールされているすべてのフォントを自分で追加する代わりに、コードを使用してリストに追加する方法はありますか?

HTML

<div id="generate">
       Change the text! 
</div>

<select id="box" onchange="font();">
    <option id="PIC" value="Kies een font">Kies een font.</option>
    <option id="TNR" value="TimesNewRoman">Times New Roman</option>
    <option id="GRG" value="Georgia">Georgia</option>
    <option id="PLT" value="PalatinoLinotype">Palatino Linotype</option>
    <option id="ARL" value="Arial">Arial</option>
    <option id="CMS" value="ComicSans">Comic Sans</option>
    <option id="IMP" value="Impact">Impact</option>
    <option id="TMS" value="TrebuchetMS">Trebuchet MS</option>
    <option id="TSB" value="TheSansBlack">The Sans Black Plain</option>
</select><br />

Javascript

 function font() {
        var sf = document.getElementById('box').value;
        var generate = document.getElementById('generate');

        switch(sf){
            case 'TimesNewRoman': 
                generate.style.fontFamily = ('Times New Roman')
                break;
            case 'Georgia': 
                generate.style.fontFamily = ('Georgia')
                break;
            case 'PalatinoLinotype': 
                generate.style.fontFamily = ('Palatino Linotype')
                break;
            case 'Arial': 
                generate.style.fontFamily = ('Arial')
                break;
            case 'ComicSans': 
                generate.style.fontFamily = ('Comic Sans MS')
                break;
            case 'Impact': 
                generate.style.fontFamily = ('Impact')
                break;
            case 'TrebuchetMS': 
                generate.style.fontFamily = ('Trebuchet MS')
                break;
            default: generate.style.fontFamily = ('')
            }
        }