That's essentially how things used to work, and the problem is that it too can be gamed using JavaScript. For example, a relatively naive approach might be:

1. Make an HTML <span> element that contains "The quick brown fox jumps over the lazy dog" written in the default font.

2. You can't query what font that was, but you can use the getComputedStyle() DOM function of that element to work out the width (for example) of the resulting element. Note this down.

3. Do the same for all the different fonts that you want to test.

4. If any element's width differs from the default's noted in step 2, then the corresponding font is guaranteed to be installed on your system.

As written, this won't detect the font that the user has selected to be the default font (because it won't detect the width as being different). However, you can work around this (and remove most false negatives to boot) by a simple addition:

5. Pick one of the fonts that you detected as being installed.

6. Create more elements (as in step 1) that correspond to all the fonts that were detected as being the same width as the default, but have the font you selected in step 5 as a fallback. (eg. 'font-family: Testing, Fallback;')

7. Any element with a width that differs from the font you selected in step 5 is installed on the system.

What you get will be a relatively complete list of what fonts are on the system out of the ones you tested. If you want more accuracy, you can do a similar thing with individual letters instead.