[JavaScript] Head 태그에 동적으로 추가하는 방법

안녕하세요.

JavaScript로 Head 태그에 동적으로 추가하는 방법입니다.

 

sciprt 파일과, css 파일을 추가하는 방법으로 사용하게 되면 head 태그의 맨 마지막에 추가되는 것을 볼 수 있습니다.

 

1. script head 동적 추가

const script = document.createElement('script');
script.src = '/static/js/test2.js';
script.type = 'text/javascript'
document.head.appendChild(script);

 

2. css head 동적 추가

const css1 = document.createElement('link');
css1.src = '/static/css/youtbeRealChart.css';
css1.rel = 'stylesheet';
document.head.appendChild(css1);

 

감사합니다.