在网上无数的地方,我已经看到了在JavaScript之前包含CSS的建议.一般来说,推理的形式如下:
在订购CSS和JavaScript时,您希望首先使用CSS.原因是渲染线程具有渲染页面所需的所有样式信息.如果首先包含JavaScript,则JavaScript引擎必须先解析它,然后再继续使用下一组资源.这意味着渲染线程无法完全显示页面,因为它没有所需的所有样式.
我的实际测试揭示了一些截然不同
我使用以下Ruby脚本为各种资源生成特定的延迟:
require 'rubygems'
require 'eventmachine'
require 'evma_httpserver'
require 'date'
class Handler < EventMachine::Connection
include EventMachine::HttpServer
def process_http_request
resp = EventMachine::DelegatedHttpResponse.new( self )
return unless @http_query_string
path = @http_path_info
array = @http_query_string.split("&").map{|s| s.split("=")}.flatten
parsed = Hash[*array]
delay = parsed["delay"].to_i / 1000.0
jsdelay = parsed["jsdelay"].to_i
delay = 5 if (delay > 5)
jsdelay = 5000 if (jsdelay > 5000)
delay = 0 if (delay < 0)
jsdelay = 0 if (jsdelay < 0)
# Block which …Run Code Online (Sandbox Code Playgroud) 我正在阅读一个教程,作者提到要在HTML中的结束body标记(</body>)附近包含Javascript文件.
我想知道我不应该在head部分中声明/定义JavaScript包含哪些类型的功能?对我来说,在结束body标记附近包含像Google Analytics这样的JavaScript是有道理的.在结束body标记附近定义JavaScript包含时应该注意哪些地方?
Chrome for me一直是Web标准的参考,遗憾的是不支持defer,IE从5.5版开始就支持它.为什么?
js.js
document.getElementById ("hi").innerHTML = "Hi :)";
Run Code Online (Sandbox Code Playgroud)
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset = "utf-8">
<script defer="defer" src="js.js"></script>
<title>Hi</title>
</head>
<body>
<div id="hi"></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud) 我一直在想,主要是因为在创建页面时我总是遇到麻烦,基于以下内容:
你什么时候写你的javascript
<head><body>$(document).ready()我可能是愚蠢的,但是由于错误的地方或是或否doc.ready()命令,我有几次没有执行我的JavaScript(/ jQuery).所以我真的很想知道.
jQuery和'var'命令也是如此
我们正在开发大型ASP.NET应用程序,其中包含许多包含ASCX控件的动态创建页面.我们到处都使用了很多jQuery.
我一直在阅读将内联JavaScript代码移到页面底部是有意义的,因为当它包含在"太早"时它可能会延迟加载页面.
我现在的问题是:使用jQuery时这仍然有意义吗?
大多数代码都是在ready处理程序中执行的,所以我希望这不会减慢页面的加载速度.在我的例子中,多个Usercontrols ASCX拥有所有自己的jQuery位和碎片,并且在渲染页面中将它们全部移动并不容易.
这个问题是如此基本,我肯定必须是某些东西的复制品,即使我已经找到了类似的东西.
我的问题基本上是:最初为HTML元素注册事件处理程序的最佳位置是什么?
注册事件处理程序的最简单方法显然是内联:
<div id = "mybutton" onclick = "doSomething()">Click me</div>
Run Code Online (Sandbox Code Playgroud)
但这与现代网络开发中逻辑和内容分离的压倒性进程背道而驰.因此,在2012年,所有逻辑/行为都应该在纯Javascript代码中完成.这很好,它会导致更易于维护的代码.但是你仍然需要一些初始钩子,用你的Javascript代码连接你的HTML元素.
通常,我只是这样做:
<body onload = "registerAllEventHandlers()">
Run Code Online (Sandbox Code Playgroud)
但是......那仍然是"作弊",不是吗 - 因为我们仍然在这里使用内联Javascript.但我们还有其他选择吗?我们不能<script>在该<head>部分的标记中执行此操作,因为此时我们无法访问DOM,因为页面尚未加载:
<head>
<script type = "text/javascript">
var myButton = document.getElementById("mybutton"); // myButton is null!
</script>
</head>
Run Code Online (Sandbox Code Playgroud)
我们在页面底部放置<script>标签还是什么?喜欢:
<html>
<body>
...
...
<script type = "text/javascript">
registerAllEventHandlers();
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
这里的最佳做法是什么?
我正在搞乱JavaScript实验来感受它并且已经遇到了问题.这是我的HTML代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<script type="text/javascript" src="testing.js"></script>
</head>
<body onload="writeLine()">
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
这是JavaScript testing.js:
function writeLine()
{
document.write("Hello World!")
}
Run Code Online (Sandbox Code Playgroud)
这是样式表styles.css:
html, body {
background-color: red;
}
Run Code Online (Sandbox Code Playgroud)
这是一个非常简单的例子,但我可能选择了一个尴尬的例子,在body标签中使用on-load.所以上面的代码加载并运行函数,但样式表什么都不做,除非我删除头部的脚本标记.我已经尝试将脚本标记放在其他地方,但没有任何作用.我已经研究了如何正确链接到JavaScript文件的在线,并没有找到没有明确的解决方案,任何人都可以指出我的错误?
我之前使用过JavaScript,但是在我再使用它之前,我想要从头开始清楚地理解它
javascript ×7
html ×2
jquery ×2
asp.net ×1
attributes ×1
css ×1
events ×1
head ×1
location ×1
performance ×1