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>

常见事件

相关推荐
光影少年15 分钟前
Vue的响应式原理?Vue2和Vue3有什么区别?
前端·vue.js·掘金·金石计划
孟祥_成都23 分钟前
Cursor 要被淘汰了?开发者最应该关注的 10 个信号
前端·人工智能
cxxcode32 分钟前
Sentry browserTracingIntegration 实现原理深度解析
前端
孟沐35 分钟前
大白话理解 Java 序列化:对标前端 JSON.stringify/parse
前端
忘ci38 分钟前
electron、edge.js调用C#动态链接库的一些问题
前端
yannick_liu41 分钟前
推荐一个可以在vue2中格式化json数据的插件
前端
可视之道41 分钟前
Canvas 渲染引擎性能优化实战:从 15 FPS 到 55 FPS
前端
进击的尘埃1 小时前
拖拽搭建场景下的智能布局算法:栅格吸附、参考线与响应式出码
javascript
小猪努力学前端1 小时前
基于PixiJS的试玩广告开发-续篇
前端·javascript·游戏
bluceli2 小时前
前端构建工具深度解析:从Webpack到Vite的演进之路
前端