1、功能效果图

2、代码实现

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8">

		<title>HelloWorld</title>

	</head>

	<body>

		<!-- 在HTML代码中定义一个按钮 -->

		<button type="button" id="helloBtn">SayHello</button>

	</body>

	<!-- 在script标签中编写JavaScript代码 -->

	<script type="text/javascript">

		// document对象代表整个HTML文档

		// document对象调用getElementById()方法表示根据id查找对应的元素对象

		var btnElement = document.getElementById("helloBtn");

		// 给按钮元素对象绑定单击响应函数

		btnElement.onclick = function(){

			// 弹出警告框

			alert("hello");

		};

	</script>

</html>

JS---HelloWorld的更多相关文章

  1. Three.js基本 Demo

    对于新手来说,几个简单的例子非常实用,偶然发现几个不错的Demo,分享给大家! Three.js基本 Demo 1.最基本的Hello World:http://stemkoski.github.io ...

  2. Three.js 3D特效学习

    一.Three.js基本介绍 Three.js是JavaScript编写的WebGL第三方库.提供了非常多的3D显示功能.Three.js 是一款运行在浏览器中的 3D 引擎,你可以用它创建各种三维场 ...

  3. Three.js学习笔记 – “我和小伙伴都惊呆了”的特效和Three.js初探

    什么是Three.js three.js是JavaScript编写的WebGL第三方库.提供了非常多的3D显示功能.Three.js 是一款运行在浏览器中的 3D 引擎,你可以用它创建各种三维场景,包 ...

  4. React.js学习

    React.js学习之环境搭建 1 工欲善其事必先利其器:前端开发工具 1.1 WebStorm和Sublime Text Sublime Text:作为代码编辑器,Sublime Text的优点如下 ...

  5. React.js学习之环境搭建

    1 工欲善其事必先利其器:前端开发工具 1.1 WebStorm和Sublime Text Sublime Text:作为代码编辑器,Sublime Text的优点如下: 主流前端开发编辑器 体积较小 ...

  6. 【关于新版Cocos2dx/Cocos2d-JS】安装包和使用方式的变化

    最近有读者反馈说,最新的Cocos2dx或者说2d-JS下载之后跟书本说的安装方式相差很大. 刚下载最新版3.9试了一下,其实用法还是没有变的. 新版把cocos2dx和cocos2d-js合并了,这 ...

  7. 使用grunt构建seajs项目

    1.安装nodejs 2.安装grunt-cli npm install -g grunt-cli 3.进入到项目目录,同时准备好package.json和Gruntfile.js文件 //packa ...

  8. 创建jira插件

    准备环境.安装SDK https://developer.atlassian.com/docs/getting-started/set-up-the-atlassian-plugin-sdk-and- ...

  9. phantomjs使用说明

    phantomjs使用说明 12条评论   phantomjs实现了一个无界面的webkit浏览器.虽然没有界面,但dom渲染.js运行.网络访问.canvas/svg绘制等功能都很完备,在页面抓取. ...

  10. phantomjs API

    phantomjs使用说明         phantomjs实现了一个无界面的webkit浏览器.虽然没有界面,但dom渲染.js运行.网络访问.canvas/svg绘制等功能都很完备,在页面抓取. ...

随机推荐

  1. WPF 截图控件之移除控件(九)「仿微信」

    WPF 截图控件之移除控件(九)「仿微信」 WPF 截图控件之移除控件(九)「仿微信」 作者:WPFDevelopersOrg 原文链接: https://github.com/WPFDevelope ...

  2. Computational Protein Design with Deep Learning Neural Networks

    本文使用深度神经网络完成计算蛋白质设计去预测20种氨基酸概率. Introduction 针对特定结构和功能的蛋白质进行工程和设计,不仅加深了对蛋白质序列结构关系的理解,而且在化学.生物学和医学等领域 ...

  3. Python 实现列表与二叉树相互转换并打印二叉树封装类-详细注释+完美对齐

    # Python 实现列表与二叉树相互转换并打印二叉树封装类-详细注释+完美对齐 from binarytree import build import random # https://www.cn ...

  4. RocketMQ保姆级教程

    大家好,我是三友~~ 上周花了一点时间从头到尾.从无到有地搭建了一套RocketMQ的环境,觉得还挺easy的,所以就写篇文章分享给大家. 整篇文章可以大致分为三个部分,第一部分属于一些核心概念和工作 ...

  5. Host long.com not found: 2(SERVFAIL)

    环境: centos  7.9 地址:192.168.200.100 相关配置 name.conf文件: named.zones文件: 正反解析文件: 重启DNS服务: 1 [root@server ...

  6. Web 前端实战：JQ 实现下拉菜单

    实现过程 实现一个简易的鼠标悬停菜单项显示其子项的下拉框控件.将用到 CSS 绝对定位.流式布局.动画等:JQuery 鼠标移入和移出事件.DOM 查找.效果图如下: HTML 结构: <div ...

  7. NOI2021 同步赛游记

    写在前面的话 为什么叫游记呢?因为我第一天是在划水中度过的,错过了对原题的发现. O n e I n D a r k \tt OneInDark OneInDark 无比风光地去了浙江,却倒霉地遇上了 ...

  8. Electron学习（四）之应用程序打包

    highlight: a11y-dark 写在前面 人真的是会变得越来越懒的,也正是人的惰性吧,真的是很讽刺. 关于这个应用程序的开发,断更了很久,但是代码部分还算没落下吧,终于在周一.周二终把这个应 ...

  9. 第七章 完成kubernetes集群部署并验证

    在其中一运算个节点上操作就行 创建nginx资源配置清单的yaml文件 [root@hdss7-21 ~]# vim /opt/kubernetes/conf/nginx-ds.yaml apiVer ...

  10. 《吐血整理》进阶系列教程-拿捏Fiddler抓包教程(18)-Fiddler如何接口测试，妈妈再也不担心我不会接口测试了

    1.简介 Fiddler最大的优势在于抓包,我们大部分使用的功能也在抓包的功能上,fiddler做接口测试也是非常方便的. 领导或者开发给你安排接口测试的工作任务,但是没有给你接口文档(由于开发周期没 ...