1、Javascript函数-了解函数的用途

1.1、函数：

　　函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块

2、Javascript函数-定义函数

2.1、function必须小写

　　

3、Javascript函数-调用函数

3.1、调用方式：

　　在<script>标签内部调用
　　在HTML文件中调用

　　　　加一个onclick()函数

4、Javascript函数-带参数的函数

　　onclick="demo('iwen',20)";

　　在这里要注意的是在双引号内部传string类型数值时需要使用单引号。

5、Javascript函数-带返回值的函数

　　有时需要将函数的值返回给调用他的地方。

　　通过使用return语句就可以实现

　　注意：在使用return语句时，函数会停止执行，同时返回值；

　　return

6、Javascript函数-局部变量和全局变量

　　

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<script>

    var n = 10; m = 10;//全局变量

    function demo(){

        var i = 10;//局部变量

        x = 10;//全局变量（但是要等x所在的demo函数调用之后才可以使用）

    }

    demo();

    alert(x);

</script>

</body>

</html>

　　

2、事件

2.1、什么是事件？

　　事件是可以被JavaScript侦测到的行为

2.2、主要事件

事件 描述
onClick 单击事件
onMouseOver 鼠标经过事件
onMouseOut 鼠标移出事件
onChange 文本内容改变事件
onSelect 文本框选中事件
onFocus 光标聚集事件
onBlur 移开光标事件
onLoad 网页加载事件
onUnload 关闭网页事件 
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body onload="mgs()">

    <div class="div" onmouseout="onOut(this)" onmouseover="onOver(this)">this</div>

    <script>

        function onOver(ooj){

            ooj.innerHTML = "hello";

        }

        function onOut(ooj){

            ooj.innerHTML = "world";

        }

    </script>

    <form>

        <input type="text" onchange="alert('内容改变了');">

        <input type="text" onselect="changeDemo(this)">

    </form>

    <script>

        function changeDemo(bg){

            bg.style.background = "blue";

        }

        function mgs(){

            alert("网页内容加载完毕");

        }

    </script>

</body>

</html>

异常处理

1、异常：

　　当JavaScript引擎执行JavaScript代码时，发生了错误，导致程序停止运行

2、异常抛出

　　当异常产生，并且将这个异常生成一个错误信息

3、异常捕获

　　try{

　　　　//发生异常的代码块;

　　}catch(err){

　　　　错误信息处理;

　　}

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<script>

    function demo(){

        try{

            alert(str);//正确错误都要执行。

        }catch(err){

            alert(err);

        }

    }

    demo();

</script>

</body>

</html>

4、Throw语句

　　通过throw语句创建一个自定义错误

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<form>

    <input type="text" id="txt">

    <input type="button" id="button" onclick="demo()" value="按钮">

</form>

<script>

    function demo(){

        try{

            var e = document.getElementById("txt").value;

            if(e == ""){

                throw "用户输入异常 == null";

            }

        }catch(err){

            alert(err);

        }

    }

</script>

</body>

</html>

web前端学习（四）JavaScript学习笔记部分（3）-- JavaScript函数+异常处理+事件处理的更多相关文章

  1. web前端－－知识点，笔记叠加（javascript,jquery,html5+css3.0,ajax）

    函数传参列表,获取方法arguments的使用 function arg(){ var str = '总共传了'+arguments.length+'个参数\n'; for(var i=0;i< ...

  2. Web前端与移动开发学习路线图

    文章转载自「开发者圆桌」一个关于开发者入门.进阶.踩坑的微信公众号 这里整理的Web前端与移动开发学习路线图包含初中级两个部分,你可以通过百度云盘下载观看对应的视频 链接: http://pan.ba ...

  3. 想做web前端project师应该学习些什么？

    偶然间看到这篇文章.感觉博主写的挺不错的,假设你想做web前端project师的话,建议您阅读下面这篇文章,事实上web前端project师所做的工作事实上就是站点设计,有些小公司的美工事实上就是做w ...

  4. 最全的WEB前端开发程序员学习清单

    史上最全的WEB前端开发程序员学习清单! 今天为什么要给大家分享这篇文章呢,我发现最近来学前端的特别多,群里面整天都有人问:前端好找工作吗?前端要怎么学啊?前端工资怎么样?前端XX,前端XXX,虽然我 ...

  5. web前端开发控件学习笔记之jqgrid+ztree+echarts

    版权声明:本文为博主原创文章,转载请注明出处.   作为web前端初学者,今天要记录的是三个控件的使用心得,分别是表格控件jqgrid,树形控件ztree,图表控件echarts.下边分别进行描述. ...

  6. 2022年Web前端开发流程和学习路线（详尽版）

    前言 前端侧重于人机交互和用户体验,后端侧重于业务逻辑和大规模数据处理.理论上,面向用户的产品里,所有问题(包括产品.设计.后端.甚至看不见的问题)的表现形式,都会暴露在前端,而只有部分问题(数据问题 ...

  7. 最适合2018年自学的web前端零基础系统学习视频＋资料

    这份资料整理花了近7天,如果感觉有用,可以分享给更有需要的人. 在看接下的介绍前,我先说一下整理这份资料的初衷: 我的初衷是想帮助在这个行业发展的朋友和童鞋们,在论坛博客等地方少花些时间找资料,把有限 ...

  8. web前端零基础入门学习！前端真不难！

    现在互联网发展迅速,前端也成了很重要的岗位之一,许多人都往前端靠拢,可又无能为力,不知所措,首先我们说为什么在编程里,大家都倾向于往前端靠呢?原因很简单,那就是,在程序员的世界里,前端开发是最最简单的 ...

  9. 史上最全的web前端开发程序员学习清单！

    今天为什么要给大家分享这篇文章呢,我发现最近来学前端的特别多,群里面整天都有人问:前端好找工作吗?前端要怎么学啊?前端工资怎么样?前端XX,前端XXX,虽然我回答过无数次这种问题了,但是问这个的还是有 ...

  10. WEB 前端模块化，读文笔记

    文章链接 WEB 前端模块化都有什么? 知识点 根据平台划分 浏览器 AMD.CMD 存在网络瓶颈,使用异步加载 非浏览器 CommonJS 直接操作 IO,同步加载 浏览器 AMD 依赖前置 req ...

随机推荐

  1. Python学习day01 - 计算机基础

    第一天 什么是编程 语言就是用来交流的. 语言+火构成了人类的文明 Python语言用来和计算机交流 通过他和计算机交流,然后完成很多程序员想要完成的事情,就叫编程. 为什么要编程 节省劳动力,更高效 ...

  2. adb命令总结

  3. xlwt/xlwt/Style.py excel样式源文件

    from __future__ import print_function # -*- coding: windows-1252 -*- from . import Formatting from . ...

  4. 【ZJOI2007】【BZOJ1059】矩阵游戏 匈牙利算法

    题目描述 小Q是一个非常聪明的孩子,除了国际象棋,他还很喜欢玩一个电脑益智游戏——矩阵游戏.矩阵游戏在一个N*N黑白方阵进行(如同国际象棋一般,只是颜色是随意的).每次可以对该矩阵进行两种操作:行交换 ...

  5. uni-app中不使用scroll-view组件,监听页面滑直底部事件

    最终达到的目标效果 将要用到 监听页面滚动事件:onPageScroll 获取节点信息uni.createSelectorQuery() 标签布局 <template> <view ...

  6. 微信小程序上传报错：以下文件没有被打包上传: · .gitignore

    简单粗暴的办法就是:找到gitignore文件,把该文件删除掉即可. 在使用Git的过程中,我们喜欢有的文件比如日志,临时文件,编译的中间文件等不要提交到代码仓库,这时就要设置相应的忽略规则,来忽略这 ...

  7. 左神算法书籍《程序员代码面试指南》——2_02在单链表和双链表中删除倒数第k个字节

    [题目]分别实现两个函数,一个可以删除单链表中倒数第K个节点,另一个可以删除双链表中倒数第K个节点.[要求]如果链表长度为N,时间复杂度达到O(N),额外空间复杂度达到O(1).[题解]从头遍历链表, ...

  8. OCP/OCA Oracle 学习001

    select * from TEST3 t select object_type, count(object_type) from user_objects group by object_type ...

  9. U盘安装Linux CentOS 6.8 系统

    1.插入U盘在服务器中的USB接口: 2.选择启动的U盘进入装系统的页面: 3.选择English,按ok: 4.选UEFI:SanDisk Cruzer Edge 1.26 5.选 us 按 ok ...

  10. Java正则表达式实例详解

    创建正则表达式 你可以从比较简单的东西入手学习正则表达式.要想全面地掌握怎样构建正则表达式,可以去看JDK 文档的java.util.regex 的Pattern 类的文档. 字符 B 字符B \xh ...