Jquery to Vanilla js, fontsize auto

Question

不能转换为香草JS，对不起笨拙的英语(需要从外部块更改字体大小。

fontsize = function () {
    var fontSize = $("#container").width() * 0.10; // 10% of container width
    $("#container h1").css('font-size', fontSize);
};
$(window).resize(fontsize);
$(document).ready(fontsize);

body, html {
    height:100%;
    width:100%;
}
#container {
    height:75%;
    width:75%;
    background-color:#eeeeee;
    padding:1%;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="container">
    <h1>This is my text</h1>
</div>

Answer 1

它可以完全没有JS

完成

body, html {
    height:100%;
    width:100%;
}
#container {
    height:75%;
    width:75%;
    background-color:#eeeeee;
    padding:1%;
}
#container h1 {
    font-size: 7.5vw /* 100vw = 100%. then 75% of container and 10% font size will be 7.5 */
}

<div id="container">
    <h1>This is my text</h1>
</div>