[已解决]为什么加了defer属性后，外部文件还是执行不了？

隨鈊乄鎍慾 · 发表于 2018-5-6 20:46:27

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

html代码主体如下：

<!DOCTYPE html>
<html>
<head>
<title>定义文档内嵌代码</title>
<meta charset="utf-8">
<meta name="viewport" content="width=width, inital-scale=1.0">
<meta name="keywords" content="小甲鱼,Web开发，HTML5,css3,web编程教学">
<meta name="description" content="《零基础入门学习web开发》案例演示">
<meta name="author" content="小甲鱼">
<script type="text/javascript" src="java.js" defer></script>
</head>
<body>
<p>I love fishc.com!</p>
</body>
</html>

复制代码

js文件如下：

document.write("我最帅！")

复制代码

按理来说先解析后执行结果会是先打印：“I love fishc.com！”,再打印“我最帅！”
但是执行结果只打印了：“I love fishc.com！”

最佳答案

月排行榜 / 总排行榜

不二如是

2018-5-6 22:58:33

本帖最后由不二如是于 2018-5-7 10:49 编辑

正常来讲，输出两个…

为啥只有一个呢？

请看下文分解

正常测试：

<!DOCTYPE html>
<html>
<head>
<title>定义文档内嵌代码</title>
<meta charset="utf-8">
<meta name="viewport" content="width=width, inital-scale=1.0">
<meta name="keywords" content="小甲鱼,Web开发，HTML5,css3,web编程教学">
<meta name="description" content="《零基础入门学习web开发》案例演示">
<meta name="author" content="小甲鱼">
<script type="text/javascript" src="java.js"></script>
</head>
<body>
<p>I love fishc.com!</p>
</body>
</html>

复制代码

java.js:

document.write("我最帅！");

复制代码

正常浏览器加载顺序，script->输出“我最帅”->渲染DOM树完成->“I love fishc.com!”

增加der延迟（如你所示）：

"我最帅"去哪里了呢？

小甲鱼演示中明明修改DOM成功了啊，问题出在：

“HTML DOM Document 对象 ”

因为你想利用document.write来在HTML中插入标签，就如同让浏览器在解析HTML的时候动态得添加标签。

一般来讲没问题，但是script有了degfer延迟属性后，就会很尴尬：

defer以后，浏览器早已完成了HTML的解析，文档流关闭，document.write不具备开启文档流的设定，所以defer后，没有DOM树可以用，所以没法插入，所以看不到

一般来讲，document.write，日常开发在外部文件中很少使用...

跳转到最佳答案楼层

ba21 · 发表于 2018-5-6 21:16:52

你这放到head 有用吗？
看看这里：
https://blog.csdn.net/qq_34986769/article/details/52160532

不二如是 · 发表于 2018-5-6 22:58:33

本帖最后由不二如是于 2018-5-7 10:49 编辑

正常来讲，输出两个…

为啥只有一个呢？

请看下文分解

正常测试：

<!DOCTYPE html>
<html>
<head>
<title>定义文档内嵌代码</title>
<meta charset="utf-8">
<meta name="viewport" content="width=width, inital-scale=1.0">
<meta name="keywords" content="小甲鱼,Web开发，HTML5,css3,web编程教学">
<meta name="description" content="《零基础入门学习web开发》案例演示">
<meta name="author" content="小甲鱼">
<script type="text/javascript" src="java.js"></script>
</head>
<body>
<p>I love fishc.com!</p>
</body>
</html>

复制代码

java.js:

document.write("我最帅！");

复制代码

正常浏览器加载顺序，script->输出“我最帅”->渲染DOM树完成->“I love fishc.com!”

增加der延迟（如你所示）：

"我最帅"去哪里了呢？

小甲鱼演示中明明修改DOM成功了啊，问题出在：

“HTML DOM Document 对象 ”

因为你想利用document.write来在HTML中插入标签，就如同让浏览器在解析HTML的时候动态得添加标签。

一般来讲没问题，但是script有了degfer延迟属性后，就会很尴尬：

defer以后，浏览器早已完成了HTML的解析，文档流关闭，document.write不具备开启文档流的设定，所以defer后，没有DOM树可以用，所以没法插入，所以看不到

一般来讲，document.write，日常开发在外部文件中很少使用...

隨鈊乄鎍慾 · 发表于 2018-5-7 11:15:09

本帖最后由隨鈊乄鎍慾于 2018-5-7 11:35 编辑

不二如是发表于 2018-5-6 22:58
正常来讲，输出两个…

为啥只有一个呢？

哦，说得是呢！感谢不二大神耐心讲解！

也许是没有学过javascript吧！大概明白不二大神的讲解了。但“DOM树”是个什么鬼？不懂。求科普一下。

STmove · 发表于 2018-7-11 23:47:21

隨鈊乄鎍慾发表于 2018-5-7 11:15
哦，说得是呢！感谢不二大神耐心讲解！
也许是没有学过javascript吧！大概明白不二大神的讲 ...

https://baike.baidu.com/item/HTML%20DOM/4585925?fr=aladdin
以上来自百度百科，然而因为基础知识严重匮乏，看不懂.....兄弟你现在知道这是啥玩意儿了么？

隨鈊乄鎍慾 · 发表于 2018-7-12 09:05:19

STmove 发表于 2018-7-11 23:47
https://baike.baidu.com/item/HTML%20DOM/4585925?fr=aladdin
以上来自百度百科，然而因为基础知识严重 ...

应该是文档流关闭了，没有对象可以用吧。

账号		自动登录	找回密码
密码			立即注册