代码编织梦想

方法一:

<!DOCTYPE html>
<html>
<head>
	<title>Javascript中点击事件方法一</title>
</head>
<body>
	<button id="btn">click</button>
	<script type="text/javascript">
		var btn = document.getElementById("btn");
		btn.οnclick=function(){
			alert("hello world");
		}
	</script>
</body>
</html>

方法二:

<!DOCTYPE html>
<html>
<head>
	<title>Javascript中点击事件方法二</title>
</head>
<body>
	<button id="btn">click</button>
	<script type="text/javascript">
		var btn = document.getElementById("btn");
		btn.addEventListener('click',function(){
			alert("hello wrold");
		},false)
	</script>
</body>
</html>

方法三:

给html标签内添加 onclick属性 , 值 写 js中 定义的函数名 ,最终 实现 调用 

<!DOCTYPE html>
<html>
<head>
	<title>Javascript中点击事件方法三</title>
	<script type="text/javascript">
		function test(){
			alert("hello world");
		}
	</script>
</head>
<body>
	<button id="btn" οnclick="test()">click</button>
</body>
</html>

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/m0_64494670/article/details/127158476

javascript里判断的多种写法_qianliwind的博客-爱代码爱编程

JavaScript复杂判断的更优雅写法 摘要: 写代码是一门艺术。 原文:JavaScript 复杂判断的更优雅写法作者:Think. Fundebug经授权转载,版权归原作者所有。 前提 我们编写js代码时经常遇到复杂逻辑判断的情况,通常大家可以用if/else或者switch来实现多个条件判断,但这样会有个问题,随着逻辑复杂度的增加,代码

vue main.js各种写法和含义_huhanghao的博客-爱代码爱编程_main.js

Vue main.js各种写法和含义 遇到的main.js的三种写法: 第一种: 通过webpack 初始化的项目 // The Vue build version to load with the `import` command // (runtime-only or standalone) has been set in webpack.ba

react总结之事件的写法-爱代码爱编程

开发中的时候,总是会写各种各样的事件,来实现去后台数据交互,页面之间的交互等!在react中事件的写法有很多种,当然这些写法的最终目的是一样的,只是在代码层面所展示的有些区别!下面总结一下,我所知道的事件的各种写法!(这里明确一点,react中事件都是使用的驼峰命名的规则) 第一种写法 第一种写法是使用箭头函数 import React, { Com

JavaScript绑定键盘事件的多种写法-爱代码爱编程

使用JavaScript来绑定键盘事件时,有多种写法,而他们的实现效果实际上是等价的,下面一一来列举。 方式一: function keyboard() { document.onkeydown = function() { let keycode = event.keyCode; if (keycode == 32) {

vue中 点击事件的写法_vue中的事件:原生事件与自定义事件__Vue.js-爱代码爱编程

模板编译 processAttrs 对于ast attributes处理(v-on/@) 利用onRE与dirRE来捕获事件 这里最重要的就是dynamic的判断,vue中可以用动态参数来命名事件名称,如@[prop],prop为data中的值。不过通常都是一个静态的事件名称如 @click 另一个核心方法就是addHandler

JavaScript中 事件处理的四种方式-爱代码爱编程

在javascript中给html标签绑定事件并处理有着四种基本方式。每种方式都有着各自的优缺点。 ① 手工触发 用法 在HTML代码中用事件属性执行代码或函数。 优点 使用直接、简单,哪个HTML标签要触发什么事件,则就在该HTML标签上加事件属性。 缺点 不能做到JS与HTML完全分离。 实现 <input type="text

java对象赋值优雅写法_JavaScript优雅写法及骚操作-爱代码爱编程

昨天看权威指南的时候看到一个个人觉得很优雅的写法,便想着记录一下(我的梦想就是写一手富有诗意的优雅代码)在Js世界中,有些操作会让你无法理解,但是却无比优雅。如有错误,欢迎批评指正!(看前先点赞,养成好习惯哈哈哈) 1、 判断为空 直白写法 if(a == undefined) a = []; if(params.success){ para

JS中常用的一些事件(触发方法)-爱代码爱编程

  onclick:元素上发生鼠标点击时触发。 ondblclick:  元素上发生鼠标双击时触发。 onmouseenter:当鼠标移动到连接了侦听器的元素上时,会触发该事件。 onmouseover: 当鼠标移动到附加了侦听器的元素或其子项之一上时,会触发该事件。 mouseleave:当鼠标移出连接有侦听器的元素时,会触发该事件。 onm

php js写法,javaScript封装的各种写法-爱代码爱编程

这篇文章主要介绍了javaScript封装的各种写法,通过列举优缺点和使用场景详细介绍了几种JavaScript封装的格式,对JavaScript的感兴趣朋友可以参考下本篇文章 在javascript的世界里,写法是个神奇的现象,真是百家齐开放啊!每次看到老外写的js组件,思想和写法都怪异,就没看到一个js结构基本相同的代码出来。今天,我就来谈谈js

JavaScript事件进阶:事件对象e(event)(三)-爱代码爱编程

本章字数7873字。 上一篇文章《JavaScript进阶认识:什么是事件冒泡过程与捕获过程?有什么用处?》我们讲到事件对象e,利用了一个方法e.target,通过冒泡过程,从而实现了点击父级元素里面的子元素触发父级元素事件,再从父级元素事件对象e,找到真正触发事件发生的子元素源,实现隔行换色的代码。这个技巧要认真琢磨。 那么,什么是事件对象e呢?

JS有哪几种写法-爱代码爱编程

行内JS。什么是行内?行内就是在你所要实现效果的HTML标签里面。 例如:<button onclick= "alert('你好')">哈喽</button> 这就是行内JS了,但是这样写是不推荐的,因为这样代码不够整洁和日后的维护。 内部JS。内部JS通常用来运行一些小网页,和一些小部分的触发效果,也是写在HTML文档里面,

js函数常见的写法以及调用方法-爱代码爱编程

文章目录 1:常规写法2:匿名函数写法3:将方法作为一个对象4.构造函数中给对象添加方法5.自执行函数 1:常规写法 //函数的写法 function run{ alert("常规写法") //这里是你函数的内容 } //调用 run() 2:匿名函数写法 var run = function(){ alert("

js多种判断写法_紫轩阁的博客-爱代码爱编程

JavaScript复杂判断的更优雅写法 摘要: 写代码是一门艺术。 原文:JavaScript 复杂判断的更优雅写法 作者:Think. Fundebug经授权转载,版权归原作者所有。 前提 我们编写js代码时经常遇到复杂逻辑判断的情况,通常大家可以用if/else或者switch来实现多个条件判断,但这样会有个问题,随着逻辑复杂度的增加,代码中的i

【元素绑定事件的多种写法】_weixin_51538235的博客-爱代码爱编程

前情了解 在学习前端的过程中,了解到绑定元素的多种写法,各位小伙伴会有点迷茫,小胡就自己目前所了解到汇总一下,欢迎评论区的各位大佬指正~ 解决方案 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <me

css容器查询终于来了_@大迁世界的博客-爱代码爱编程

CSS容器查询终于来了! 它们目前在谷歌浏览器(105)中得到了支持,很快就会在Safari 16中得到支持。这对前端来说容器查询与媒体查询一样重要。 在这节课中,我们介绍一下容器查询是如何工作的,如何使用它们,以及语法是

vite + vue3 —— vue地图大屏项目_vue大屏展示项目实例-爱代码爱编程

​回顾  前期  ​        前端利器 —— 提升《500倍开发效率》 传一张设计稿,点击一建生成项目 好牛_0.活在风浪里的博客-CSDN博客如果非要说它有什么缺点,那么我觉得就是它会,让你cv大法都没处使!!!比如:公司让你写一个小程序、或h5web页面、UI给了你30张UI图,说让你自己切图,你当时就准备拍案而起,拳棒相加,但

go七天开发挑战:7天实现web框架-爱代码爱编程

 学习资料来自:GitHub - geektutu/7days-golang: 7 days golang programs from scratch (web framework Gee, distributed cache GeeCache, object relational mapping ORM framework GeeORM, rpc fra