最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

关于script在html中的摆放位置解析

来源:动视网 责编:小OO 时间:2020-11-27 15:27:28
文档

关于script在html中的摆放位置解析

首先是想实现一个select标签,有是和无两个option,但是在初始化的时候要求select标签默认选择空值,所以在点击的时候加了一个方法让他把空值删掉。XML/HTML Code复制内容到剪贴板。
推荐度:
导读首先是想实现一个select标签,有是和无两个option,但是在初始化的时候要求select标签默认选择空值,所以在点击的时候加了一个方法让他把空值删掉。XML/HTML Code复制内容到剪贴板。


以前一直觉得script在html中的任何位置都可以,今天做一个需求的时候才更正了自己的错误思想啊--script的位置也不是随便放的。本文主要谈论关于script在html中的摆放位置。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。希望能帮助到大家。

首先是想实现一个select标签,有是和无两个option,但是在初始化的时候要求select标签默认选择空值,所以我在点击的时候加了一个方法让他把空值删掉:

XML/HTML Code复制内容到剪贴板

  1. <!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中的摆放位置解析

首先是想实现一个select标签,有是和无两个option,但是在初始化的时候要求select标签默认选择空值,所以在点击的时候加了一个方法让他把空值删掉。XML/HTML Code复制内容到剪贴板。
推荐度:
标签: 位置 中的 的位置
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top