以前一直觉得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>
&nbsp;
<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中的摆放位置的更多相关文章

  1. TextArea中定位光标位置

    原文:TextArea中定位光标位置 在项目中,遇到一个场景:希望能在TextArea中输入某条记录中的明细(明细较简单,没有附属信息,只用记录顺序和值即可,譬如用"+"号来作为明 ...

  2. Google自动广告,将广告代码放置在 HTML 中的什么位置?

    Google自动广告,将广告代码放置在 HTML 中的什么位置? 为自动广告生成广告代码后,您需要将此代码放置在要展示广告的每个网页中.您应将广告代码放置在网页的 <head> 标记(或正 ...

  3. 得到当前对象在不同大小的页面中的绝对位置,及冒泡cancelBubble

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  4. Ladda 应用提交表单的时候显示loading载入中 包含不同位置,不同效果

    Ladda 应用提交表单的时候显示loading载入中 包含不同位置,不同效果 不同大小.位置,效果,进度条等 演示 XML/HTML Code <article class="exa ...

  5. 路由器桥接(WIFI无线中继)设置及摆放位置图解

    路由器桥接(WIFI无线中继)设置及摆放位置图解 WIFI实在好用,但它的波覆盖面小.穿透力很差.我们安装时要考虑波的衍射特点,装在衍射效果最佳的位置(居中,室外可绕,避开密封墙).确实无法兼顾的地方 ...

  6. script标签引入脚本的引入位置与效果

    用script标签引入脚本的引入位置大致有两种情况: 1,在head中引入: 2,在body末尾引入: 浏览器由上到下解析代码,正常情况下,先解析head中的代码,在解析body中的代码:放在head ...

  7. JS查找数组中出现的位置及个数

    查找某个值在数组中出现的位置 var attr = [1,4,5,3,2,7,6,9]; var zhao = 8; var sy = -1; for(var i=0;i<attr.length ...

  8. UAC在注册表中的对应位置

    UAC在注册表中的对应位置 HKEY_LOCAL_MACHINE/SOFTWARE/Microsoft/Windows/CurrentVersion/Policies/System 相关键值设置: U ...

  9. Java 类中各成分加载顺序 和 内存中的存放位置

    参加一个笔试,有一个关于类的静态代码块.构造代码块.构造函数的执行顺序的问题.不太清楚,网上百度了一下.在这里记录一下. 一.什么时候会加载类?使用到类中的内容时加载:有三种情况1.创建对象:new ...

随机推荐

  1. windows 7(32/64位)GHO安装指南(U盘制作篇)~

    本篇接着上篇的介绍,为同学讲解U盘启动盘的制作.虽然本篇大白菜的官网上也有类似的教程,但是为了完整性,我将在这里为大家细细的讲解.在这里说一下,系统包和软件包的下载大家可以自行下载,很简单的,小主就不 ...

  2. 【swift】BlockOperation和GCD实用代码块

    //BlockOperation // // ViewController.swift import UIKit class ViewController: UIViewController { @I ...

  3. Flexbox 自由的布局

    css3提出了一种新的布局方式.她并没有以摧枯拉朽之势博得我的喜爱.我和她的故事总是伴随着苦涩的味道.世道变了,总要做出些选择才能跟紧步伐.她很强大,能满足你天马行空的需求而不必抓掉一大把头发.她却很 ...

  4. 集成基于OAuth协议的单点登陆

    在之前的一篇文章中,我们已经介绍了如何为一个应用添加对CAS协议的支持,进而使得我们的应用可以与所有基于CAS协议的单点登陆服务通讯.但是现在的单点登陆服务实际上并不全是通过实现CAS协议来完成的.例 ...

  5. 如何从本地导入.nupkg文件

    买了本asp.net mvc4高级编程 里面的源码下载下来是.nupkg后缀的文件,不知道怎么引入到项目中, baidu无果,只好google,可怜我英语四级都难的人,不过所幸还是找到了方法: htt ...

  6. java类的加载机制

    什么是类装载器ClassLoader ClassLoader是一个抽象类 ClassLoader的实例将读入Java字节码将类装载到JVM中 ClassLoader可以定制,满足不同的字节码流获取方式 ...

  7. .Net使用system.Security.Cryptography.RNGCryptoServiceProvider类与System.Random类生成随机数

    .Net中我们通常使用Random类生成随机数,在一些场景下,我却发现Random生成的随机数并不可靠,在下面的例子中我们通过循环随机生成10个随机数: ; i < ; i++) { Rando ...

  8. WPF自定义RoutedEvent事件代码段

    今天在写东西的时候,发现常用的代码段里没有RoutedEvent的,因此,写了一个代码段,方便以后使用,顺便记录一下,如何做代码段. 1.在项目中新建一个XML文件,将扩展名修改为snippet. 2 ...

  9. 黄聪:C#类似Jquery的html解析类HtmlAgilityPack基础类介绍及运用

    Html Agility Pack下载地址:http://htmlagilitypack.codeplex.com/ Html Agility Pack 源码中的类大概有28个左右,其实不算一个很复杂 ...

  10. .NET Core的文件系统[1]:读取并监控文件的变化

    ASP.NET Core 具有很多针对文件读取的应用.比如我们倾向于采用JSON文件来定义配置,所以应用就会涉及针对配置文件读取.如果用户发送一个针对物理文件的HTTP请求,应用会根据指定的路径读取目 ...