首先来说说页面的加载顺序（这里列的比较细致一点）,先贴一段html结构用来说明
![]()
浏览器从上到下解析HTML结构。
加载并解析style里面的样式。
加载外部样式表
解析外部样式表。
加载外部脚本文件。
执行外部脚本同时阻塞页面后续的内容（页面的渲染，img图片资源的下载等）。
加载页面内脚本，解析脚本，执行脚本
异步加载img
页面dom模型构造完
图片资源等加载完成
页面加载完毕
所以你的问题是在head标签内部的script脚本执行的时候操作了dom，而那个时候dom还没构造。
给你三个解决方案：
body里面加一个onload方法,,然后head里面的script脚本去定义这个方法就行了
head里面的script脚本移到body的最下面
使用jquery document.ready
