对象 

　　创建  var   myObject = {};/* 声明对象字面变量*/　添加值myObject.name="Jener";myObject.age=25;

　　代码格式　　var person = {name : "zhangsan",age : 25,say :function(){alert("说汉语");} }

　　访问   点语法、person.name; person.say();

js的入口函数   window.onload=function(){}

函数   有一定功能代码体的集合   函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

基本结构  function functionname(){执行代码}  function functionname(参数){执行代码}

带有返回值的函数     /*function sum(a,b){return a+b;}sum(10,5);//程序执行完这句话，sum(10,5)变成了15；var c=sum(10,5);alert(c);*///c是15

变量的生命周期    JavaScript 变量生命周期在它声明时初始化。局部变量在函数执行完毕后销毁。全局变量在页面关闭后销毁

闭包：是指内部函数可以使用外部函数的变量

js事件

　　onclick事件  点击事件    ondbclick事件　　双击事件 

　　onload事件  页面一开始加载的时候会先调用这个方法。此方法只能写在<body>标签之中

　　onchange事件　　当内容改变时触发。可用于文本框、列表框等对象，该事件一般用于响应用户修改内容带来的其他改变操作。

　　　　　　　　　　说明：当用户向一个文本框中输入文本时，不会触发onchange事件，只有用户输入结束后，单击文本框以外的区域，

　　　　　　　　　　使文本框失去焦点时才触发该事件，如果是下拉框，则选择结束后即触发。

　　onblur事件和onfocus事件　　onblur事件，当前元素失去焦点时触发该事件。对应的是onfocus事件：得到焦点事件

　　onscroll事件　　窗口滚动事件：当页面滚动时调用函数。此事件写在方法的外面，且函数名后面不加括号，例如window.onscroll=move　

　　　　　　　　　方式  function move() {alert("页面滚动时调用");}window.onscroll = move;

　　鼠标相关事件      onmousemove  鼠标移动到某对象范围的上方时，触发事件调用函数。注意：在同一个区域中，只要鼠标动一次就触发一次事件。

                                 onmouseout　　鼠标离开某对象范围时，触发事件调用函数。

　　　　　　　　　　　　　　　　onmousemove 事件在鼠标移动到 div 元素上时触发。

　　　　　　　　　　　　　　　　mouseleave 事件只在鼠标指针移出 div 元素时触发。

　　　　　　　　　　　　　　　　onmouseout 事件在鼠标指针移出 div 元素及离开子元素（p 和 span）时触发。

　　　　　　　　onmouseover 鼠标移动到某对象范围的上方时，触发事件调用函数。注意：在同一个区域中，无论怎样移动都只触发一次函数。

　　　　　　　　onmouseup 当鼠标松开时触发事件

　　　　　　　　onmousedown 当鼠标按下键时触发事件

通过循环给多个元素添加事件

<body>

		<div class="one">111</div>

		<div class="one">222</div>

		<div class="one">333</div>

		<div class="one">444</div>

	</body>

</html>

<script type="text/javascript">

	var one  = document.getElementsByClassName("one");

	for(var i = 0;i<one.length;i++){

		one[i].onclick = function(){

			alert(this.innerHTML);

		}

	}

</script>

　通过addEventListener() 方法 监听事件函数

无参数

<button id="myBtn">点我</button>

<script>

document.getElementById("myBtn").addEventListener("click", myFunction);

function myFunction() {

    alert ("Hello World!");

}

</script>

有参数

<button id="myBtn">点我</button>

<p id="demo"></p>

<script>

var p1 = 5;

var p2 = 7;

document.getElementById("myBtn").addEventListener("click", function() {

    myFunction(p1, p2);

});

function myFunction(a, b) {

    var result = a * b;

    document.getElementById("demo").innerHTML = result;

}

</script>

　　removeEventListener() 方法

<body>

<div id="myDIV"> div 元素添加了 onmousemove 事件句柄，鼠标在桔红色的框内移动时会显示随机数。

  <p>点击按钮移除 DIV 的事件句柄。</p>

  <button onclick="removeHandler()" id="myBtn">点我</button>

</div>

<p id="demo"></p>

<script>

document.getElementById("myDIV").addEventListener("mousemove", myFunction);

function myFunction() {

    document.getElementById("demo").innerHTML = Math.random();

}

function removeHandler() {

    document.getElementById("myDIV").removeEventListener("mousemove", myFunction);

}

</script>

　　

js对象 事件的更多相关文章

  1. 初始js闭包&事件的冒泡和捕获&EVENT对象

    一.初识闭包 function a(){   var n = 0;   this.inc = function () {     n++;     console.log(n);   }; } var ...

  2. python 全栈开发，Day55(jQuery的位置信息,JS的事件流的概念(重点),事件对象,jQuery的事件绑定和解绑,事件委托(事件代理))

    一.jQuery的位置信息 jQuery的位置信息跟JS的client系列.offset系列.scroll系列封装好的一些简便api. 一.宽度和高度 获取宽度 .width() 描述:为匹配的元素集 ...

  3. Node.js自定义对象事件监听与发射

    一.Node.js是以事件驱动的,那我们自定义的一些js对象就需要能监听事件以及发射事件.在Node.js中事件使用一个EventEmitter对象发出,该对象在events模块中.它应该是使用观察者 ...

  4. Vue之挂载点、变量、事件、js对象、文本指令、过滤器、事件指令和属性指令

    1.vue导入-挂载点 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=&qu ...

  5. java：JQuery（声明，JQ和JS对象的区别，prop，attr，addClass，offset，trigger，dblclick和change事件，hide，show，toggle，slideUp，slideDown，slideToggle，三种选择器，标签的获取，三张图片的放大与缩小）

    1.JQuery: jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计 的宗旨是“ ...

  6. js函数事件对象

    每个函数都有4个默认对象 arguments 保存着实际传入的参数,集合列表 return 有两个功能,打断函数和返回函数值 this 谁调用的函数,this就是谁 event 事件对象 事件 box ...

  7. js键盘事件全面控制详解

      js键盘事件全面控制 主要分四个部分第一部分:浏览器的按键事件第二部分:兼容浏览器第三部分:代码实现和优化第四部分:总结 第一部分:浏览器的按键事件 用js实现键盘记录,要关注浏览器的三种按键事件 ...

  8. Js 冒泡事件阻止

    Js 冒泡事件阻止   1. 事件目标 现在,事件处理程序中的变量event保存着事件对象.而event.target属性保存着发生事件的目标元素.这个属性是DOM API中规定的,但是没有被所有浏览 ...

  9. js event 事件兼容浏览器 ie不需要 event参数 firefox 需要

    js event 事件兼容浏览器    ie不需要 event参数   firefox 需要 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...

随机推荐

  1. 第九篇 数据表设计和保存item到json文件

    上节说到Pipeline会拦截item,根据设置的优先级,item会依次经过这些Pipeline,所以可以通过Pipeline来保存文件到json.数据库等等. 下面是自定义json #存储item到 ...

  2. 008-Java的StringBuilder和StringBuffer

    StringBuffer 和 StringBuilder 与String的不同 String Java中十分重要的类;被声明为final class.除了hash这个属性, 其他属性也均声明为fina ...

  3. 通过hint干掉笛卡尔积

    Z_ZZZZZZZZ_BENE 大约有400万数据 修改前   SELECT xxxx FROM ( SELECT DISTINCT FIELD1_CONTENT FROM xxxxxxxx_LOG@ ...

  4. Html+css编写太阳星系

    我们都知道太阳系是以太阳为中心的,和所有受到太阳的引力约束天体的集合体.包括八大行星(由离太阳从近到远的顺序:水星.金星.地球.火星.木星.土星.天王星.海王星),而我用html和css所写的就是八大 ...

  5. Mybatis_环境搭建

    1.配置pom文件 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="h ...

  6. react-router踩坑

    1.当用BrowserRouter时,<Link/>组件必须放在BrowserRouter里,如果是存在于某个组件里的Link,则该组件也必须放在Router里,不然会出现url改变页面为 ...

  7. 代码格式化工具---prettier配置

    我自己的常用 prettier 配置如下: // .prettierrc 文件 // 这里修改的都是与默认值不同的,没有修改到的就是启用默认值 // .prettierrc 文件是使用 json 格式 ...

  8. luoguP1415 拆分数列 [dp]

    题目描述 给出一列数字,需要你添加任意多个逗号将其拆成若干个严格递增的数.如果有多组解,则输出使得最后一个数最小的同时,字典序最大的解(即先要满足最后一个数最小:如果有多组解,则使得第一个数尽量大:如 ...

  9. 【SPOJ DQUERY】区间数字统计

    [链接] 我是链接,点我呀:) [题意] 题意 [题解] 因为区间的端点移动一个单位的话,只会涉及到一个元素的增多或减少. 因此可以用莫队算法来解决. 只需要开一个数组(大小1百万),用下标来快速检索 ...

  10. kafka拦截器原理|案例实操

    拦截器原理 Producer拦截器(interceptor)是在Kafka 0.10版本被引入的,主要用于实现clients端的定制化控制逻辑. 对于producer而言,interceptor使得用 ...