CSS 파일을 내부에 임베드 <style> elments

Question

다른 스타일 시트를 동적으로 바꾸려고합니다. 내가 React를 사용하기 때문에, 내가 요구하는 스타일 시트()는 html에 "스타일"요소로 포함됩니다.
내가 시도한 것은 이전 스타일 요소를 제거하고 새 스타일 시트를 포함하는 새로운 요소를 만드는 것입니다.
그러나 방금 작성한 <style> 요소에 내 newstyle.css의 내용을 "삽입"하는 것이 쉽지 않은 것을 깨달았습니다.

우아한 해결책이 있습니까?

xhttp GET 요청을 사용하여 .css 파일을 읽는 중 시도했지만 실패했습니다. 이 특정 주제에 대해 몇 가지 질문이 있지만 상황에 따라 React가 다르다고 생각합니다. xhttp GET에 대한 내 style.css에 대한 단순한 상대 경로를 제공 할 수없는 것처럼 보입니다.

필자도 React specific file-reader를 찾았지만 일반적으로별로 찾지 못했습니다. 어쩌면 파일을 "수동으로"읽는 나의 접근법은 React, 노드 등을 사용하는 프로젝트에 적합하지 않습니다.

도움을 주셔서 감사합니다.이 질문이 불필요하거나 모호하지 않기를 바랍니다.

Answer 1

이 기능이 작동합니까? 스타일 모두 미리 설정되어있는 경우

const newCSS = document.createElement('link'); 
newCSS.href = `/path/to/templates/${style}.css`; 
newCSS.rel = 'stylesheet'; 
document.head.appendChild(newCSS);