当前位置：网站首页 > 技术文章 > 正文

JavaScript函数及事件和DOM

myzbx 2025-01-10 15:42 56 浏览

一、函数（需要先定义，再调用）

1.什么是函数：是完成特定任务的代码语句块(可以理解为java中的方法).

2.函数分类：分为系统函数和自定义函数

3.常用的系统函数

parseInt("数字字符串"); //将字符串转化为数字

parseFloat("数字字符串"); //将字符串转化为小数

isNaN(temp) isNaN判断变量是不是非数字，不是数学返回true，反之false。

4.自定义函数：

4.1.自定义函数：

function 函数名称(形参列表){

函数体....

return [返回值];

}

注意:形参列表的格式:参数名1,参数名2...

4.2.调用函数

函数名称(实参列表);

变量名=函数名称(实参列表); //调用带函数值的函数

二、标签事件(网页机制)

1.理解标签事件

<标签事件名称="js代码" />

注意:标签事件名称都以on开头.

2.理解标签事件与函数

<标签事件名称="函数();" />

3.标签常用事件

onload 网页加载事件，利用body标签添加事件

onclick 光标点击事件

ondblclick 光标双击事件

onmouseover 光标移上对象触发

onmouseout 光标移出对象触发

onfoucs 获得焦点

onblur 失去焦点

onchange 选中项发生改变触发(针对下拉列表)

三、Dom操作

1.理解DOM(Document Object Model):文档对象模型

将标签看作成对象的过程。

2. 操作dom对象(理解标签)

//1.通过标签id属性定位dom对象

var obj=document.getElementById("one");

//2.使用value属性控制表单对象的值

dom对象.value[=值];

//3.控制非表单对象的内容

dom对象.innerText="我会<br/>改变层中内容啦!"; //不支持解析标签

dom对象.innerHTML="我会<br/>改变层中内容啦!"; //支持解析标签

//4.控制标签的样式

//4.使用style属性控制dom对象的样式

dom对象.style.color="red";

dom对象.style.fontSize="24px";

dom对象.style.backgroundColor="yellow";

注意:js操作的样式属性就是css样式属性不加杠，将杠后的首字母大写

5.使用className属性设置类选择器

dom对象.className="类选择器名";

HTML 事件

上一篇：JavaScript:事件循环机制(同步、异步)(单、多线程)
下一篇：雅培多款奶粉出事疑似造成一婴儿死亡现全球紧急召回

JavaScript函数及事件和DOM

相关推荐

使用VSCode模板提高Vue开发效率（vscode开发vue3）

吃透 Vue 项目开发实践|16个方面深入前端工程化开发技巧【下】

8.7k star，一款超炫酷的动态可视化大屏项目

说下你的vue项目的目录结构，该怎么划分?

用上Vue3，你真的变了吗?（vue3 key）

移动前端重构实战系列:5-7章（前端移动端主要技术有哪些）

这么牛逼的cursor功能，赶紧用起来

browser-use:AI 驱动的浏览器自动化神器——DOM识别与交互详解

巧克力:从一朵花开始的华丽变身_巧克力花束教程视频

comfyui安装MimicMotion扩展，AI跳舞动作模仿