JavaScript(二)

最新推荐文章于 2024-04-30 16:57:21 发布

First 007

最新推荐文章于 2024-04-30 16:57:21 发布

阅读量356

点赞数

分类专栏： javaweb 文章标签： javascript 函数表单数据 json

本文链接：https://blog.csdn.net/kairui007/article/details/50534375

版权

javaweb 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

JavaScript(二)

目录内容

【1】js函数创建
【2】js事件
【3】js常用事件
【4】DOM
【5】innerHTML属性
【6】表单数据提交方式
【7】表单的校验
【8】json格式与其解析
【js函数创建】

使用function关键字或者new Function

方式一：
function funName(param_list){
//js代码
}
调用：
funName(param_list);

方式二：

右边是匿名函数，左边变量接收

var funName = function(param_list){
    //js代码
};//严格地说，这里需要加分号，因为这是一条赋值语句
调用：
funName(param_list);

方式三：

动态函数创建

var funName = new Function(param_list,jsCode);
调用：
funName(param_list,jsCode);

按钮调用代码：

<input type="button" value="测试 var funName = funName(){}" onclick="funName3(1,2);">

函数的重载

这里重点说一个arguments，做好一个功能，有很多时候会用到这个arguments数组，

这个arguments一般使用的情况是：创建函数的时候参数列表是空的，但是使用的时候我们传递了参

数，这时候就需要用到arguments数组来得到参数列表的具体参数。

实例代码：

function funName(){//这里没有参数
//js代码
}
//函数调用
funName(1,2,3);//调用传递了参数,这是如果要使用这些参数，就需要在 js代码 中使用到arguments

【js事件】

js的事件是事件驱动的使用。这里的事件都是通过操作我们学过的html的标签来触发的，

比如，一个按钮标签

我们通过点击这个按钮，就触发了按钮的点击事件(οnclick=”clickEvent();”),其中clickEvent()

是我们自己定义创建的函数

事件和html标签的绑定方式

1、使用html标签的事件属性

    一个普通文本输入项
    <input type="text" onclick="test1()">
//定义的函数:
    function test1(){
//js代码
    }
      红色的为标签事件属性(点击事件)

2、动态绑定(赋值函数名称)

    一个普通文本输入项
    <input type="text" id="testInput">
    js代码：
    document.getElementById("testInput").onclick = test1;//注意，这里不写 ()//定义的函数:
    function test1(){
//js代码
    }

3、动态绑定(匿名函数赋值)

    一个普通文本输入项
    <input type="text" id="testInput">
    js代码：
// = 右边是匿名函数 
    document.getElementById("testInput").onclick = function(){//js代码}

【js常用事件】

onload事件：使用在标签上

<body onload="bodyOnload();"></body>
js代码：
alert("body load");
实际代码已注释掉了，不然每次刷新都会弹窗

onclick事件：
几乎所有的标签，除了特殊的看不到的标签

alert(“input点击事件”);

点击：

onfocus事件：获取焦点后触发；凡是可以获取焦点的标签

alert(“input获取焦点事件”);

点击(获取焦点)：

onblur事件：失去焦点后触发；凡是可以获取焦点的标签都可释放焦点

alert(“input失去焦点事件”);

点击里面，再点击页面其他地方(失去焦点)：

onmouseover事件：鼠标经过其上触发
鼠标放到上面：

onmouseout事件：鼠标离开时触发
鼠标放到上面再离开：

onkeypress事件：按下键盘某个键(自己选择)时触发
点击进去按回车键：

【DOM】

DOM是js的三大组成部分之一，另外两个：ECMAScript和BOM

DOM是用来解析标记型文档的(如：html、xml等)。

这里提到了几个对象：document(DOM中的核心对象，代表当前html页面)、Element(元素对象在，这里指的是html标签对象)、文本对象和属性对象，这些都属于一个最高对象Node对象

目前我们使用DOM解析html文档，加载html页面时，其实就已经存在了这个document核心对象，并且html页面内容加载到内存，会得到一个 document对象，同时存在了页面中的标签对象，这里的每一个标签都会变成一个Element对象，成了对象就有了响应的方法，把这里理解好了，DOM入门就very easy了。

dom 参考文档点击后选择打开即可

document对象

write方法:向页面输出内容(很可能会把原来的数据在同一页面覆盖掉)

document.write(“返回前一页面

First 007

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript(二)

JavaScript(二)目录内容【1】js函数创建【2】js事件【3】js常用事件【4】DOM 【5】innerHTML属性【6】表单数据提交方式【7】表单的校验【8】json格式与其解析【js函数创建】使用function关键字或者new Function方式一：function funName(param_list){//js代码}调用：funName
复制链接

扫一扫