js为什么不是按着载入的顺序依次执行

Question

我用的 code prettify 源码高亮.
必须写在<pre>中才能高亮,而且<pre>必须要加入class="prettify"
于是我就用$("pre").attr("class","prettify");一次性在js中全部加了.
就不需要手写了.
代码大概是这个样子

<pre>
&lt;?php
echo "hello world";
?&gt;
</pre>

底部的js顺序是这样的

<script src="./public/js/jquery.min.3.2.1.js"></script>
<script>$(function () {
        $("pre").attr("class", "prettyprint");
    });</script>
<script src="./public/prettify/run_prettify.js"></script>

在谷歌浏览器下是能正常的先解析jq,然后解析我的添加class的js.最后才是执行源码高亮的js.
但是在火狐和ie下都是先执行jq,第二步执行源码高亮的js.第三部执行我手写的js
不知道为什么会这样.

Answer 1

$(function () {
        $("pre").attr("class", "prettyprint");
    });

$(function () { 是在页面DOM加载完以后执行里面的JS，JS已经按照你的顺序在执行。只是中间你放的是事件监听。
你可以把代码高亮也放在DOM加载完之后。

Answer 2

https://github.com/amdjs/amdj...
https://segmentfault.com/q/10...
这个帖子可以解决你的问题

Answer 3

<script src="./public/js/jquery.min.3.2.1.js"></script>
<script>
    $("pre").attr("class", "prettyprint");
</script>
<script src="./public/prettify/run_prettify.js" defer="defer"></script>

试试