Programming Tips - javaScript: On-the-fly style

Date: 2019oct31 Language: javaScript Keywords: dynamic, on-the-fly, css, style Q. javaScript: On-the-fly <style> A. I first looked into seeing if you could limit the scope of a <style> statement. There were attempts at this but it currently doesn't seem to be possible. So the best insurance is to give your global style names long prefixes. Here is my function which adds some <style> to the current document. It uses jQuery.
function initMyApplicationStyle() { if ($('#myapplication-style').length > 0) { console.log('initMyApplicationStyle: already there'); return; } console.log('initMyApplicationStyle: not there, adding'); const style = '<style id="myapplication-style">' + '#myapplication-main { font-size: 100em; ... }' + '#myapplication-thing1 { background-color: #ccc; ... }' + '</style>'; $(document.body).prepend(style); }