JS(DOM、事件)

DOM

  • 概念:Document Object Model,文档对象模型。
  • 将标记语言的各个组成部分封装为对应的对象:
  1. Document:整个文档对象
  2. Element:元素对象
  3. Attribute:属性对象
  4. Text:文本对象
  5. Comment:注释对象
  • JavaScript通过DOM,就能够对HTML进行操作:
  1. 改变 HTML 元素的内容
  2. 改变 HTML元素的样式(CSS)
  3. 对 HTML DOM 事件作出反应
  4. 添加和删除 HTML 元素

事件绑定

  • 方式一:通过HTML表签中的事件属性进行绑定

    复制代码
    <input type="button" onclick="on()" value="按钮1">
    <script>
         function on(){
             alert('我被点击了!'    );
         }
    </script>
  • 方式二:通过DOM元素属性绑定

    复制代码
    <input type="button" id="btn" value="按钮2">
    <script>
         document.getElementById('btn').onclick=function(){
             alert('我被点击了!');
    }
    </script>

常见事件

相关推荐
摘星编程2 分钟前
OpenHarmony环境下React Native:Tooltip自动定位
javascript·react native·react.js
雾岛听蓝6 分钟前
C++11 列表初始化与右值引用核心解析
开发语言·c++·经验分享
穿过锁扣的风8 分钟前
如何操作HTML网页
前端·javascript·html
San30.15 分钟前
从零构建坚固的前端堡垒:TypeScript 与 React 实战深度指南
前端·react.js·typescript
小北方城市网16 分钟前
Spring Boot 多数据源与事务管理实战:主从分离、动态切换与事务一致性
java·开发语言·jvm·数据库·mysql·oracle·mybatis
痴儿哈哈16 分钟前
C++与硬件交互编程
开发语言·c++·算法
yunhuibin28 分钟前
VideoPipe环境搭建及编译ubuntu240403
前端·人工智能
roman_日积跬步-终至千里36 分钟前
【Java 并发-面试】从线程基础到企业级开发的知识点概况
java·开发语言
云中飞鸿36 分钟前
VS2015安装后,安装QT59,之后安装qt-vsaddin-msvc2015-2.4.3.vsix 文件失败问题!
开发语言·qt
m0_7482331740 分钟前
C与C++:底层编程的六大核心共性
java·开发语言