jquery 代码执行 的疑问
body {
background:red;
}
</style>
<script type="text/javascript" src="jquery-1.3.1.js"></script>
<script type="text/javascript">
$(document.body).css( "background", "black" );//这句没执行!!!
</script>
为什么jquery代码 没执行
非得 在 $(document).ready(function(){})或$(function(){}) 执行吗 不能像javascript 直接执行吗 展开
把jQuery代码写到$(document).ready(function(){/* code */})【可以简写成$(function(){/* code */})】里面是为了确保DOM已经加载完毕,再执行里面的代码,并不是说“不能”像JavaScript那样直接执行。
你的这段代码不是没有执行,而是因为DOM没加载完毕,才没产生预期效果。
你如果用遨游的话,可以打开你这个文件,然后调出收集面板【默认快捷键Ctrl + G】,里面输入你的那段代码,点击绿色的运行按钮就会发现可以运行的。IE8的话按F12可以调出调试工具来找到相应的调试器。
写JavaScript很经常发生的一种错误就是,在DOM没有加载完毕,就使用了相应的对象【就如你的代码里面那句css()】,就会出现脚本错误。所以如果涉及到DOM的东西都要放到window.onload里面运行,而jQuery的$(document).ready()就改善了这方法,而且还能放N个$(document).ready()。而window.onload只能运行一次。
你可以把下面的代码加到HTML里面试下:
普通JavaScript:
window.onload=funcion(){alert("这个onload不会运行");};
window.onload=funcion(){alert("因为这个onload把上面的覆盖了");};
加入jQuery.js:
$(document).ready(funcion(){alert("这是第一个ready");};
$(funcion(){alert("这是第二个ready");});
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
body {
background:red;
}
</style>
<title>Hello World jQuery!</title>
<script type="text/javascript" src="scripts/jquery-1.3.2-vsdoc2.js"></script>
</head>
<body>
<input type="button" onclick="a();" />
<script type="text/javascript">
function a()
{
$(document.body).css( "background", "black" );//这句没执行!!!
}
</script>
</body>
</html>
那句本来就是对的没错,没有得到想要的效果是因为你前面已经定义了CSS,想要预想的效果就必须要一个触发条件,如上代码。而且我觉得象你原来的代码那样写没什么意义吧? 或者你可以把样式表去掉也可以~ 那一句jquery和样式表定义实际上有什么区别呢?
你的语句$(document.body)就是DOM方式运行的
除非你用函数调用
function tx(){
$(document.body).css( "background", "black" );
}