Нужно подгрузить head с помощью js

В проекте есть html код, который используется как отдельно, так и подгружается к другой страницы. Поэтому в первом случае необходимо добавлять к нему head, а во втором нет. Пробовал реализовать через js, но по какой-то причине стили срабатывают, а кодировка нет

<script>
    if (window.location.pathname.toString() == "/avents/src/content/about.html") {
    let head = document.createElement("head");
    console.log(head);
    document.head.innerHTML = `     <meta charset="UTF-8">
        <link rel="stylesheet" href="../css/bootstrap-reboot.min.css">
        <link rel="stylesheet" href="../css/style.min.css">`;
}
</script>

<div>пример текста</div>