프론트엔드/Web API

JS 코드로 .css 파일 혹은 .js 파일 삽입하기

Jake Seo 2022. 6. 1. 20:32

개요

가끔 CSS 파일이나 JS 파일을 javascript 코드를 이용하여 동적으로 삽입하고 싶을 때가 있다. 그 때 아래의 코드를 이용하면 편리하다.

코드

if (document.getElementsByTagName("head") != null) {
    document.getElementsByTagName("head")[0].insertAdjacentHTML(
        "beforeend",
        '<link rel="stylesheet" href="/css/mycss.css"> />'
    );
}
  • head 태그에 insertAdjcentHTML() 메서드를 이용해 추가해주는 방식이다.
  • insertAdjacentHTML() 메서드는 문자열을 HTML 태그 형태로 바꾸어주는 역할을 하는 메서드이다.

레퍼런스

insertAdjacentHTML 메서드 설명 공식문서

반응형