JS代码的位置与事件响应代码块的封装问题
放在<head>部分
最常用的方式是在页面中head部分放置<script>元素，浏览器解析head部分就会执行这个代码，然后才解析页面的其余部分。
JavaScript代码在网页读取到该语句的时候就会执行。
比如进行页面显示初始化的js必须放在head里面，因为初始化都要求提前进行（如给页面body设置css等）；而如果是通过事件调用执行的function那么对位置没什么要求的。
事件响应代码块的封装
<script>/* document.onclick = function () {alert("You have clicked in the document!");};var img = document.getElementById("mainImage");img.onclick = function () {alert("You have clicked on the picture!");};*//* 若将document.onclick放在img onclick事件之前，那么只会提示document的onclick *//* 若将img onclick放在document.onclick事件之前，那么无任何提示*/</script>
<body><img src="data:images/image.jpg" id="mainImage">document.onclick =function(){alert("You have clicked in the document!");};var img = document.getElementById("mainImage");img.onclick =function(){alert("You have clicked on the picture!");};//此时document.onclick与img.onclick的顺序不影响执行结果</body>
推荐做法（正确的姿势...）
<script>functionDemo(){document.onclick =function(){alert("You have clicked in the document!");};var img = document.getElementById("mainImage");img.onclick =function(){alert("You have clicked on the picture!");};}window.onload =function(){Demo();}</script>
JS代码的位置与事件响应代码块的封装问题的更多相关文章
- 二、JavaScript语言--JS基础--JavaScript进阶篇--事件响应
1.什么是事件 JavaScript 创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件. 比如说,当用户 ...
- 查找和定位Android应用的按钮点击事件的代码位置基于Xposed Hook实现
本文博客地址:https://blog.csdn.net/QQ1084283172/article/details/80956455 在进行Android程序的逆向分析的时候,经常需要通过Androi ...
- JS事件调试 - 查找HTML元素绑定的事件以及绑定代码所在位置
日常的网页开发调试工作中,经常需要知道指定的某个网页元素绑定了哪些事件以及绑定代码的位置,下面介绍三种用来跟踪页面中的事件的方法. 1.使用firefox调试 我们可以使用firefox的debug工 ...
- 【iOS 开发】iOS 开发 简介 (IOS项目文件 | MVC 模式 | 事件响应机制 | Storyboard 控制界面 | 代码控制界面 | Retina 屏幕图片适配)
一. iOS 项目简介 1. iOS 文件简介 创建一个 HelloWorld 项目, 在这个 IOS 项目中有四个目录 : 如下图; -- HelloWorldTests 目录 : 单元测试相关的类 ...
- JS代码放置位置、变量与数据类型、运算符与逻辑表达运算符
内容简要: 1.JS代码放置位置的问题: 2.变量与数据类型: 3.运算符与逻辑表达式的运算符 我的位置 全局问题:为何在网页推荐位置(一般在<head></head>内部 ...
- WEB开发：如何用js来模拟服务器的ajax响应，不依赖服务器来编写前端代码
一.问题的提出 目前web前端开发,主流的思路是: 1)编写静态的html文件(不使用模板技术,与服务器无关) 2)页面通过ajax与服务器交互,进行数据的传输,数据格式为json格式 这里存在一个问 ...
- js模拟点击事件实现代码
js模拟点击事件实现代码 类型:转载 时间:2012-11-06 在实际的应用开发中,我们会常常用到JS的模事件,比如说点击事件,举个简单的例子,点击表单外的"提交"按钮来提交表单 ...
- 通过js或jq增加的代码，点击事件或其他一些事件不起作用时
通过js或jq增加的代码,点击事件或其他一些事件不起作用时,可使用 $(document).on("click",".noshow",function() { ...
- js代码点击触发事件
js触发按钮点击事件 function load(){ //下面两种方法效果是一样的 document.getElementById("target").onclick(); do ...
随机推荐
- python排序算法的实现-快速排序
1. 算法描述: 1．先从数列中取出一个数作为基准数. 2．分区过程,将比这个数大的数全放到它的右边,小于或等于它的数全放到它的左边. 3．再对左右区间重复第二步,直到各区间只有一个数. 2.pyth ...
- C# MailMessage Attachment 中文名附件发邮件-Firefox中文显示正常，网页打开邮件附件中文名乱码
一.故事 首先通过CDO.Message来获取邮件EML相关数据:邮件标题.邮件内容.邮件附件.发件人.收件人.CC主要就这么几个,其次通过MailMessage来组织邮件通过Python来发送邮件! ...
- Jdbc如何从PostgreSql读取海量数据？PostgreSql源代码分析纪录
前言: 最近做数据同步,需要从PostgreSql获取数据,发现一旦数据比较多,那么读取的速度非常慢,并且内存占用特别多&GC不掉. 代码样例: 为了方便讲解,下面写了事例代码,从b2c_or ...
- TIB自动化测试快讯 - Appium手机自动化测试学习资料精选
TIB自动化测试快讯 - Appium手机自动化测试学习资料精选 Appium+Android+Javahttp://automationqa.com/forum.php?mod=viewthre ...
- uniGUI试用笔记（十四）TUniTreeView的CheckBox
TUniTreeView目前版本没有封装CheckBox功能,所以需要手工处理,幸好0.99版提供部分代码了,修改过程如下: 1.uniGUIAbstractClasses.pas单元中修改基类TUn ...
- Timeout 时间已到。在操作完成之前超时时间已过或服务器未响应。
近来遇到这样一个错误:Timeout 时间已到.在操作完成之前超时时间已过或服务器未响应.错误截图如下: 错误原因分析:产生错误时我执行的操作需要的执行时间比较长.我测试了一下,那个操作用到的存储过程 ...
- Android之TextView密码输入变星号时间
private static class Visible extends Handler implements UpdateLayout, Runnable{ public Visible(Spann ...
- 解决“iOS 7 app自动更新，无法在app中向用户展示更新内容”问题
转自cocoachina iOS 7能在后台自动app,这对开发者来说和用户都很方便,但是还是有一些缺点.用户不会知道app本次更新的内容,除非他们上到app的App Store页面去查看.开发者也会 ...
- ubuntu 搭建 samba 服务器
. sudo apt-get install samba samba-common . sudo vi /etc/samba/smb.conf [alair's share] path = /home ...
- 用CentOS 7打造合适的科研环境 :zhuan
这篇博文记录了我用CentOS 7搭建地震学科研环境的过程,供我个人在未来重装系统时参考.对于其他地震学科研人员,也许有借鉴意义. 阅读须知: 本文适用于个人电脑,不适用于服务器: 不推荐刚接触Lin ...