javascript与事件

js常用事件

  1. js捕捉回车键

    1. js回调函数的event参数(一直都有传，就看你有没有接，有没有接的需求)
    2. event.keyCode(事件句柄：onkeydown)
  2. keyup事件

js回调函数概念

  1. 某事件发生时，执行某函数

js代码的执行顺序

  1. 注意加载元素与对元素进行操作的前后关系

js运算符

  1. void运算符

    <a href="javascript:void(0)" onclick="window.alert('test code')" />
    
//既保存超链接样式，点击之后执行一段js代码，同时又不能完成页面跳转
    
//void(表达式)执行表达式，但是不返回任何结果

js控制语句

  1. 常见控制语句

  2. js特殊的控制语句

    1. for...in...

    2. with语句

      	<script type="text/javascript">

		//js for..in..的两个使用场景

		//场景一:对象
      
		alert("场景1:对象");
      
		function User(username, password) {
      
			this.username = username;
      
			this.password = password;
      
		}

		var user = new User("xun", "just a test");

		for(var value in user){
      
			alert(typeof value);
      
			alert(value);
      
			alert(user[value]);
      
		}

		//场景二:数组
      
		alert("场景2:数组");
      
		var arry = [false, true, 3.14, "test"];
      
		for(var index in arry){
      
			alert(typeof index);
      
			alert(index);
      
			alert(arry[index]);
      
		}

		//js with(带上)语句
      
		with(user){
      
			alert(username + "," + password);
      
            //相当于：alert(user.username + "," + user.password)
      
		}
      
	</script>

js内置数组对象Array

  1. 对数组越界问题做了内部处理，未定义的为undefined
  2. 常用方法
<!DOCTYPE html>

<html lang="en">

    <head>

        <title>js内置数组对象</title>

        <meta charset="UTF-8">

    </head>

    <body>

        <script>

            //js内置数组对象Array

            var array1 = new Array();

            alert(array1.length);

            var array2 = new Array(3);

            alert(array2.length);

            var array3 = new Array(2, 3);

            alert(array3.length);

            //常用:var array = [];

            //特点:自动扩容

            //内置数组对象常用方法

            var array4 = array3.reverse();  //数组3自身元素也发生了反转

            alert("array3: " + array3.join("-"));

            alert("array4: " + array4.join("-"));

            //js内置数组对象可以模拟数据栈

            array3.push(1);

            alert("array3: " + array3.join("-"));

            var lastElt = array3.pop();

            alert("last element: "  + lastElt);

        </script>

    </body>

</html>

js的BOM编程

  1. window.open 与window.close

    1. window.open(url, 新窗口打开位置)
    2. window.close()关闭当前窗口

  2. window.confirm()确认框

    1. 确定，返回true
    2. 取消，返回false

  3. window.history.

    1. window.history.go(1/-1)前进/后退
    2. window.history.back()后退

  4. window.location.href 或者 document.location.href (href可以去掉)

  5. 设置当前窗口为顶级窗口

    if(window.top != window.self){
    
    window.top.location = window.self.location
    
}

图解BOM与DOM

JSON

  1. eval函数
<!DOCTYPE html>

<html lang="en">

    <head>

        <title>eval函数</title>

        <meta charset="UTF-8">

    </head>

    <body>

        <script>

            var jsonData = "{\"username\":\"zhangsan\", \"password\":\"123\"}";

            window.eval("var jsonObj = " + jsonData);

            alert(jsonObj.username + "," + jsonObj.password);

        </script>

    </body>

</html>

javascript与事件的更多相关文章

  1. jQuery $(document).ready()和JavaScript onload事件

    jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看 ...

  2. Javascript事件模型系列（四）我所理解的javascript自定义事件

    被我拖延了将近一个月的javascript事件模型系列终于迎来了第四篇,也是我计划中的最后一篇,说来太惭愧了,本来计划一到两个星期写完的,谁知中间遇到了很多事情,公司的个人的,搞的自己心烦意乱浮躁了一 ...

  3. javascript通用事件封装

    随着最近几年Html5的兴起,越来越多的应用采用html5进行实现,一个优秀的网页应用不但需要美观简洁的UI界面,更需要一个良好的交互.网页应用大部分的交互需要用javascript事件进行实现.虽然 ...

  4. javascript的事件

    前戏 今天在博客中看到了javascript的事件机制,就自己试试写一个简单的冒泡捕获测试,但是测试结果出乎了我的意料,主要是自己原来对事件了解不是很清楚,现在写篇博客记录下. 基础 先来看一下我在A ...

  5. javascript对象事件绑定方法

    javascript对象事件绑定方法 今天在做对象事件绑定的过程中出现了一点异外情况,由于事件方法是由参数传过来的,需要将当前对象call过去,方便方法体里直接调用this 错误写法 obj.oncl ...

  6. JavaScript的事件代理（转）

    如果你想给网页添加点JavaScript的交互性,也许你已经听过JavaScript的事件代理(event delegation),并且觉得这是那些发烧友级别的JavaScript程序员才会关心的什么 ...

  7. [转]javascript指定事件处理程序包括三种方式：

    javascript指定事件处理程序包括三种方式: (1):DOM0级事件处理程序 如: 代码如下: var btn=document.getElementById("mybtn" ...

  8. JavaScript中事件绑定的方法总结

    最近收集了一些关于JavaScript绑定事件的方法,汇总了一下,不全面,但是,希望便于以后自己查看. JavaScript中绑定事件的方法主要有三种: 1 在DOM元素中直接绑定 2 JavaScr ...

  9. JavaScript的事件监听、捕获和冒泡

    在前端开发中,我们经常需要对某些事件进行监听.这样只要在指定的元素上触发了该事件,就会执行一个回调函数来进行相关的操作. 而JavaScript中事件监听的方法总共有三种,分别如下: element. ...

  10. JavaScript 计时事件

    JavaScript 计时事件 通过使用 JavaScript,我们有能力作到在一个设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行.我们称之为计时事件. 在 JavaScritp 中使用计 ...

随机推荐

  1. ElasticSearch7.3学习(二十四)----相关度评分机制详解

    1.算法介绍 relevance score(相关性分数) 算法,简单来说,就是计算出,一个索引中的文本,与搜索文本,他们之间的关联匹配程度.Elasticsearch使用的是 term freque ...

  2. 安装Suberversion[SVN]到CentOS（YUM）

    运行环境 系统版本:CentOS Linux release 7.3.1611 (Core) 软件版本:Suberversion-1.7.14 硬件要求:无 安装过程 1.安装YUM-EPEL源 Su ...

  3. veeambackup通过虚拟机还原系统文件操作说明

    如何从 VeeamBackup Replication 从备份中提取文件恢复到本地.当我们的服务器中误操作删除了一些文件特别是共享文件,文件被删除后往往都是几个小时或者几天后才被发现.特别是文件服务器 ...

  4. 基于SqlSugar的开发框架循序渐进介绍（6）-- 在基类接口中注入用户身份信息接口

    在基于SqlSugar的开发框架中,我们设计了一些系统服务层的基类,在基类中会有很多涉及到相关的数据处理操作的,如果需要跟踪具体是那个用户进行操作的,那么就需要获得当前用户的身份信息,包括在Web A ...

  5. 16岁男生信息竞赛成瘾心理出现问题 妈妈：他竟说要AK我

    16岁男生信息竞赛成瘾心理出现问题 -- 妈妈:他竟说要AK我 "我儿子最近快走火入魔了,医生,你救救他吧."40出头的林女士拉着儿子走进江苏省人民医院临床心理科.近几年,信息竞赛 ...

  6. Java有根儿：Class文件以及类加载器

    JVM 是Java的基石,Java从业者需要了解.然而相比JavaSE来讲,不了解JVM的一般来说也不会影响到工作,但是对于有调优需求或者系统架构师的岗位来说,JVM非常重要.JVM不是一个新的知识, ...

  7. 记一次前端CryptoJS AES解密

    1.背景 业务需求,需要联动多个平台,涉及到各平台的模拟登录. 已知加密前明文且正常登录.(无验证码要求) 某平台验证验证方式为.\login接口POST一串json字符串 { "accou ...

  8. 互联网公司实行目标管理(OKR)五点原则和基础

    下面从公司文化.组织架构.管理者.落地执行和区别绩效考核五个方面,讲述了如何在公司落地目标管理(OKR),这些是实施OKR的基础,也是原则,虽然写得比较简单,其实是我过去两年多不断观察.实践和摸索的总 ...

  9. 关键路径 p3 清华复试上机题

    关键路径 p3 清华复试上机题 题目描述 小H为了完成一篇论文,一共要完成n个实验.其中第i个实验需要a[i]的时问去完成.小H可以同时进行若干实验,但存在一些实验,只有当它的若干前置实验完成时,才能 ...

  10. C#实现[移除文件名中的非中文字符]

    更新记录: 2022年5月28日 从程序中抽出方法复用. 处理财务文件时写的一个小函数.用于移除文件名中的非中文字符. /// <summary> /// 移除文件名中的非中文字符 /// ...