script在html中的摆放位置
以前一直觉得script在html中的任何位置都可以,今天做一个需求的时候才更正了自己的错误思想啊--script的位置也不是随便放的。
首先是想实现一个select标签,有是和无两个option,但是在初始化的时候要求select标签默认选择空值,所以我在点击的时候加了一个方法让他把空值删掉:
<!DOCTYPE html>
<html>
<head>
<script src="jquery/jquery-1.11.1.min.js"></script>
</head>
<script>
$('#checkcash').click(function () {
if ($('#checkcash').val() == '0') {
$("#checkcash option[value='0']").remove();
}
});
$("#alert").click(function(){
alert("1123");
})
</script>
<body>
是否已提现 <select id="checkcash" style="width: 181px">
<option selected="selected" value="0"></option>
<option value="1">是</option>
<option value="2">否</option>
</select>
<input type='button' id='alert' value="anwo">
</body> </html>
但是这样并不能达到想要的效果,起初以为是jquery语法错误还一直在网上查,改,但是都不管用,后来突然想到是不是应该把script放到后面,试了一下,结果果真ok了,这才恍然大悟,原来不是这样的。
后来查了一下原因是因为,html文件是自上而下的执行方式,但引入的css和javascript的顺序有所不同,css引入执行加载时,程序仍然往下执行,而执行到<script>脚本是则中断线程,待该script脚本执行结束之后程序才继续往下执行。所以,一般将script放在body之后是因为避免长时间执行script脚本而延迟阻塞。而有一些页面的效果的实现,是需要预先动态的加载一些js脚本,所以这些脚本应该放在<body>之前。其次,不能将需要访问dom元素的js放在body之前,因为此时还没有开始生成dom,所以在body之前的访问dom元素的js会出错,或者无效。就是因为这个,在dom没生成好时我就给它添加了方法,才导致这样。
真的应该多学习很多地方以为所以然了,却没深究。以后还要加油!
ps:其实还有另外一种方法,那就是用jquery的初始化页面方法,把上面给标签添加的点击事件加入到$(function(){})中也是可以的,原理和上面是一样的,这个方法是等页面加载好了才执行,所以不管放在哪都可以了!
script在html中的摆放位置的更多相关文章
- TextArea中定位光标位置
原文:TextArea中定位光标位置 在项目中,遇到一个场景:希望能在TextArea中输入某条记录中的明细(明细较简单,没有附属信息,只用记录顺序和值即可,譬如用"+"号来作为明 ...
- Google自动广告,将广告代码放置在 HTML 中的什么位置?
Google自动广告,将广告代码放置在 HTML 中的什么位置? 为自动广告生成广告代码后,您需要将此代码放置在要展示广告的每个网页中.您应将广告代码放置在网页的 <head> 标记(或正 ...
- 得到当前对象在不同大小的页面中的绝对位置,及冒泡cancelBubble
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- Ladda 应用提交表单的时候显示loading载入中 包含不同位置,不同效果
Ladda 应用提交表单的时候显示loading载入中 包含不同位置,不同效果 不同大小.位置,效果,进度条等 演示 XML/HTML Code <article class="exa ...
- 路由器桥接(WIFI无线中继)设置及摆放位置图解
路由器桥接(WIFI无线中继)设置及摆放位置图解 WIFI实在好用,但它的波覆盖面小.穿透力很差.我们安装时要考虑波的衍射特点,装在衍射效果最佳的位置(居中,室外可绕,避开密封墙).确实无法兼顾的地方 ...
- script标签引入脚本的引入位置与效果
用script标签引入脚本的引入位置大致有两种情况: 1,在head中引入: 2,在body末尾引入: 浏览器由上到下解析代码,正常情况下,先解析head中的代码,在解析body中的代码:放在head ...
- JS查找数组中出现的位置及个数
查找某个值在数组中出现的位置 var attr = [1,4,5,3,2,7,6,9]; var zhao = 8; var sy = -1; for(var i=0;i<attr.length ...
- UAC在注册表中的对应位置
UAC在注册表中的对应位置 HKEY_LOCAL_MACHINE/SOFTWARE/Microsoft/Windows/CurrentVersion/Policies/System 相关键值设置: U ...
- Java 类中各成分加载顺序 和 内存中的存放位置
参加一个笔试,有一个关于类的静态代码块.构造代码块.构造函数的执行顺序的问题.不太清楚,网上百度了一下.在这里记录一下. 一.什么时候会加载类?使用到类中的内容时加载:有三种情况1.创建对象:new ...
随机推荐
- closure
什么是闭包?百度的答案: 闭包是指可以包含自由(未绑定到特定对象)变量的代码块:这些变量不是在这个代码块内或者任何全局上下文中定义的,而是在定义代码块的环境中定义(局部变量)."闭包&quo ...
- SpringMvc中初始化参数绑定
初始化参数绑定与类型转换很类似,初始化绑定时,主要是参数类型 ---单日期 在处理器类中配置绑定方法 使用@InitBinder注解 在这里首先注册一个用户编辑器 参数一为目标类型 proper ...
- 绿色版的Linux.NET——“Jws.Mono”(续)
在前一篇文章中,我们简略的介绍了jws.mono的安装使用,以及我们如何自己动手做一个jws.mono出来. 在文章发表之后的几天里,我一直觉得有点不妥之处,直到后来猛然的意识到:我们自己动手做的jw ...
- Angular2学习笔记——Observable
Reactive Extensions for Javascript 诞生于几年前,随着angular2正式版的发布,它将会被更多开发者所认知.RxJs提供的核心是Observable对象,它是一个使 ...
- Entity Framework 6 Recipes 2nd Edition(10-7)译 -> TPH继承模型中使用存储过程
10-7. TPH继承模型中使用存储过程 问题 用一个存储过程来填充TPH继承模型的实体 解决方案 假设已有如Figure 10-7所示模型. 我们有两个派生实体: Instructor(教员)和St ...
- Atitit rss没落以及替代品在线阅读器
Atitit rss没落以及替代品在线阅读器 1.1. 对RSS的疯狂追逐,在2005年达到了一个高峰.1 1.2. Rss的问题,支持支rss,不支持url1 1.3. ,博客受到社交网络的冲击.s ...
- Golang 生成随机数
package main import ( "fmt" "math/rand" "time" ) func main() { rand.Se ...
- ERROR 1010 (HY000): Error dropping database (can't rmdir './test/', errno: 17)
在删除数据库的时候报标题所示错误 mysql> drop database test; ERROR (HY000): Error dropping database (can't rmdir ' ...
- 数据结构:二叉查找树(C语言实现)
数据结构:二叉查找树(C语言实现) ►写在前面 关于二叉树的基础知识,请看我的一篇博客:二叉树的链式存储 说明: 二叉排序树或者是一棵空树,或者是具有下列性质的二叉树: 1.若其左子树不空,则左子树上 ...
- iOS引入JavaScriptCore引擎框架(二)
为何放弃第一种方案 UIWebView的JSContext获取 上篇中,我们通过简单的kvc获取UIWebVIew的JSContext,但是实际上,apple并未给开发者提供访问UIWebVi ...