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 ...
随机推荐
- Infer初体验 for Android
安装Python Infer下载地址:https://github.com/facebook/infer 配置环境变量 vi ~/.bash_profile #infer export PATH=${ ...
- LCLFramework框架之IOC
我们都知道,在采用面向对象方法设计的软件系统中,它的底层实现都是由N个对象组成的,所有的对象通过彼此的合作,最终实现系统的业务逻辑. 借助于"第三方"实现具有依赖关系的对象之间的解 ...
- DRUPAL 慢的原因
不止一次听人抱怨DRUPAL 慢,在本地开发环境尤为常见,较为常见的原因有:- 本地环境造成慢的原因,最常见的是由update manager 造成的,如果你发现你开的DRUPAL 页面 一直在等待 ...
- JAVA SE 803 考试前突击
考试的宗旨仍然是掌握基础知识,不过鉴于Oracle的这个认证考试还有不少的大家来找茬的成份在,所以一定一定要细心为上. 关于抽象类的坑点集合: 抽象类不是必须得有抽象方法,但有抽象方法的类必须是抽 ...
- 通过PowerShell获取TCP响应(类Telnet)
通常情况下,为了检测指定的TCP端口是否存活,我们都是通过telnet指定的端口看是否有响应来确定,然而默认情况下win8以后的系统默认是不安装telnet的.设想一下如果你黑进了一个服务器,上面没装 ...
- pentaho saiku 安装全过程
公司希望也开发一套多维分析系统,以解决运营/产品无休止的需求和技术人力不足的矛盾! 一.开发选型: 一.BIRT:易用性差,所以没再使用 二.JasperReport+ireport:文档收费,不支持 ...
- 牢骚与javascript中的this
最近在看关于拖延症的一本书<拖拉一点也无妨>,后面得出结论是自己写博客大部分处于两种状态,心情很好和心情很不好的时候.因为正常状态下感觉写博客吧,是件很麻烦的事情,不如去看看电影看看漫画啥 ...
- itextpdf JAVA 输出PDF文档
使用JAVA生成PDF的时候,还是有些注意事项需要处理的. 第一.中文问题,默认的itext是不支持中文的,想要支持,需要做些处理. 1.直接引用操作系统的中文字体库支持,由于此方案限制性强,又绑定了 ...
- java之final关键字
final关键字(可以读不可以写.只读) 1.final的变量的值不能够被改变 ①.final的成员变量 ②.final的局部变量(形参) //意思是“实参”一旦传进我的方法里面,就不允许改变 2.f ...
- 小兔伴伴家庭动物园AR智能早教产品上市
2016年6月,经过乐卓大家庭所有人的共同努力,公司旗下首款新品——小兔伴伴之<家庭动物园>3D智能学习卡正式面世. 每个孩子都应该在合适的时间去体验丰富的声音.色彩和动作,<家庭动 ...