由于在头部中等待下载js文件,应用程序无法呈现



>我需要在标头中加载一组js。下面是我的标题元素:

<head><script type="text/javascript" src="https://saswdswddx.cloudfront.net/ClientLibs.js"/>
</head>

最终生成以下头部部分:

<head>
<script src="https://xxxxfffdfdfdfd.cloudfront.net/89cc9bacc8f01db1.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/211850746383fd35.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/b30b4a28e94073b3.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/bc0c3159d13ffdaf.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/080d763d10e18196.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/84df93ace8f5ef4d.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/e7b23f7c66091e21.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/1d4c3d5cded23cb2.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/6f8353875d2eab13.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/22635695f659cee6.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/f645699f959874ea.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/52bf1c32f66e3366.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/7c14d48ac546cfab.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/3c2c0190729a5de6.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/905fab7bd45ffd32.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/aa6c83d100400291.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/1583adf5ca69f94b.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/7351efd5ad3a8219.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/d2a3be708cf0ecb2.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/09511a5f22cca316.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/51a8a84831926cab.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/cebd04bf55acaf98.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/8f7a98b8524699fa.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/c765ce94b008b43a.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/d411591679fc777a.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/fd4e563878f699ca.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/a7aa4ab396dc2c06.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/74bfd02e310d0c96.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/777512d78b46f09a.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/9a00d70cd5a8f544.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/05da1be4803bfe93.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/da39a3ee5e6b4b0d.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/3d3ff45927792b85.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/34f252296c86892b.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/6598462041ef9c9f.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/da39a3ee5e6b4b0d.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/4fb6b6291f77a814.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/e555a7200b70dcee.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/0fd5ba39ae8af05a.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/e64a562a726c1b03.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/296c14c415f75a7a.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/fe68b7820bc0cf4f.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/d836af899190a3f7.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/05e03b1ae258b4cd.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/82de18bac08fa17f.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/46f426bcfc9dd89c.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/2046534748dde247.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/6e94559c187d5d00.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/74531b771786a1fd.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/39ffcb4194a365fc.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/1b05d38fb2515b7c.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/2e91a32ab37b51d5.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/4dc09203c5082946.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/8ac01bbb7f05e0a9.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/ed192084e9139b54.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/ab612c7a907116a6.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/8deedebe93f06b91.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/6012e3e21c48364e.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/8486fc770633b5d7.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/27525a908ad9afa6.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/e1c04b332299c91a.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/6048e657d7aa5b54.min.css"><script src="https://xxxxfffdfdfdfd.cloudfront.net/685b3fc65211ee22.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="https://xxxxfffdfdfdfd.cloudfront.net/7ec73ef718990b40.min.css">
</head>

此外,在我的身体部分,水疗中心以 init(( 方法开头,该方法包含变量和组件,可用的变量和组件位于 head 部分的 js 文件上方。 现在,除非并且直到我所有的js文件都加载,否则我的应用程序将不会呈现。 所以每次我收到错误,未定义的变量。 我希望正文中的 init mehod 只有在加载头部部分中的所有 js 文件后才能调用。

根据您要定位的浏览器,您可以使用也可能不能使用async关键字。

我个人在生产中使用的解决方案是将所有脚本标记移动到<body>元素的底部,并按依赖顺序对它们进行排序。

因此,您将脚本从 CDN 移动到<body>标签的底部, 然后你把带有init()方法的脚本放在它后面

例:

我有两个脚本。script1取决于script2,所以需要在它之后加载。 这是我要做的:

<!doctype html>
<html>
<head></head>
<body>
Some HTML here...
<script src="script2.js"></script>
<script src="script1.js></script>
</body>
</html>

或者,您可以使用 AJAX 以所需的任何顺序手动加载脚本,但这会非常复杂。

相关内容

最新更新