【代码笔记】Web-Javascript-JavaScript简介
一，效果图。
二，代码。
<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<title>javascript 简介</title>
<script type="text/javascript">
function displayDate() {
document.getElementById("demo").innerHTML = Date();
}
</script>
</head> <body>
<!--第一个javascript程序-->
<h1>我的第一个javascript程序</h1>
<p id="demo">这是一个段落</p>
<button type="button" onclick="displayDate()">显示日期</button>
<!--JavaScript：直接写入 HTML 输出流-->
<script>
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落</p>");
</script>
<!--对事件的反应-->
<button type="button" onclick="alert('欢迎!')">点我!</button>
<!--改变 HTML 内容-->
<p id="demo">
JavaScript 能改变 HTML 元素的内容。
</p>
<script>
function myFunction() {
x = document.getElementById("demo"); // 找到元素
x.innerHTML = "Hello JavaScript!"; // 改变内容
}
</script>
<button type="button" onclick="myFunction()">点击这里</button>
<!--改变 HTML 图像-->
<script>
function changeImage() {
element = document.getElementById('myimage')
if (element.src.match("bulbon")) {
element.src = "/images/pic_bulboff.gif";
} else {
element.src = "/images/pic_bulbon.gif";
}
}
</script>
<img id="myimage" onclick="changeImage()" src="/images/pic_bulboff.gif" width="100" height="180">
<p>点击灯泡就可以打开或关闭这盏灯</p>
<!--改变 HTML 样式-->
<h1>我的第一段Javascript</h1>
<p>请输入数字。如果输入值不是数字，浏览器会弹出提示框。</p>
<input id="demo" type="text">
<script type="text/javascript">
function myFunction() {
var x = document.getElementById("demo").value;
if (x == "" || isNaN(x)) {
alert("不是数字");
};
}
</script>
<button type="button" onclick="myFunction()">点here</button>
</body> </html>
参考资料：《菜鸟教程》
【代码笔记】Web-Javascript-JavaScript简介的更多相关文章
- JS红宝书笔记——第一章 JavaScript简介
1.JavaScript简史 Netscape公司决定开发一种客户端语言用来处理浏览器端简单的表单验证. Netscape公司派布兰登·艾奇(BrendanEich)为计划于1995年2月发布的Net ...
- JavaScript: JavaScript的简介和入门代码演示
1.Javascript的发展历史介绍: javascript是指的实在网页上编写的编程语言,其主要是控制器html的动态显示效果.HTMl能带来的只是一些基本的页面的风格,而要展示的漂亮使用CSS, ...
- WEB前端--JavaScript
JavaScript JavaScript基础 一.JavaScript简介 JavaScript是一种嵌入到HTML文件中的描述性语言,由浏览器的解释器将其动态地处理成可执行的代码,能独立地完成与客 ...
- Web前端-JavaScript基础教程上
Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...
- Web开发——JavaScript基础
参考学习: MDN JavaScript:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript ECMAScript 6入门(阮一峰):htt ...
- Web前端-JavaScript基础教程下
Web前端-JavaScript基础教程下 <script>有6个属性: async对外部脚本有效,可以用来异步操作,下载东西,不妨碍其他操作. charset为src属性指定字符集. d ...
- Web Worker javascript多线程编程（一）
什么是Web Worker? web worker 是运行在后台的 JavaScript,不占用浏览器自身线程,独立于其他脚本,可以提高应用的总体性能,并且提升用户体验. 一般来说Javascript ...
- Web Worker javascript多线程编程（二）
Web Worker javascript多线程编程(一)中提到有两种Web Worker:专用线程dedicated web worker,以及共享线程shared web worker.不过主要讲 ...
- JavaScript面向对象简介
JavaScript面向对象简介 @(编程) [TOC] 1. 命名空间 命名空间是一个容器,它允许开发人员在一个独特的,特定于应用程序的名称下捆绑所有的功能. 在JavaScript中,命名空间只是 ...
- 2015年10个最佳Web开发JavaScript库
2015年10个最佳Web开发JavaScript库 现在的互联网可谓是无所不有,有大量的JavaScript项目开发工具充斥于网络中.我们可以参考网上的指导来获取构建代码项目的各种必要信息.如果你是 ...
随机推荐
- 8：String类
String类 String类的特点: 字符串对象一旦被初始化就不会被改变. 字符串是最常用的类型之一,所以为了使用方便java就给封装成了对象方便使用 public static void str ...
- js中的块级作用域
概述 函数是js中最常见的作用域单元, 声明在一个函数内部的变量或函数会在所处的作用域中隐藏起来, 这是有意为之的非常好的设计原则. 但是随着js的发展, 我们有了某个代码块(通常指{..}内部)隐藏 ...
- markdown上下左右，跳至行尾行首，重设快捷键
概述 用markdown输入代码的时候觉得下面2件事非常不方便: (1)光标上下左右.(需要挪动手去按方向键) (2)光标跳至行尾和行首.(需要动手去按Home和End键) 为了简化,我特地更改了ST ...
- vue安装及axios、stylus、iview的安装流程整理
现在做的项目中主要用到以下几个安装包,所以整理下流程: 使用命令行工具npm新创建一个vue项目 vue中axios的安装和使用 在vue项目中stylus的安装及使用 如何在vue中全局引入styl ...
- 与LINQ有关的语言特性
在说LINQ之前必须先说说几个重要的C#语言特性 一:与LINQ有关的语言特性 1.隐式类型 (1)源起 在隐式类型出现之前, 我们在声明一个变量的时候, 总是要为一个变量指定他的类型 甚至在fore ...
- 使用 Linux 自带的 logrotate 程序来控制日志文件尺寸
1. 编写配置文件,内容如下(以 Amadeus 系统为例): 编写配置文件,放在 /etc/logrotate.d/xxxx 下,其中 xxxx 是自己取的名字,无需后缀.例如 Amadeus 系统 ...
- JVM笔记11-类加载器和OSGI
一.JVM 类加载器: 一个类在使用前,如何通过类调用静态字段,静态方法,或者new一个实例对象,第一步就是需要类加载,然后是连接和初始化,最后才能使用. 类从被加载到虚拟机内存中开始,到卸载出内存为 ...
- 新手易犯的典型缺陷--C#
这段时间花了点时间整理了几个新手易犯的典型缺陷(专门针对C#的),但是个人的力量毕竟有限缺陷的覆盖面比较窄,有些缺陷的描述也不够准确,这里先贴出来看看能不能集思广益,收集整理出更多的典型缺陷.目标就是 ...
- Docker入门之一Docker在Window下安装
最近这几年,各个大公司都在打造自己的云平台,什么阿里云,华为云,腾讯云等等云,以及各种的微服务架构,其实在这当中Docker容器技术算是一个很重要的角色. 一.下载 在下载之前首先检查一下自己的电脑是 ...
- EF SaveChanges() 报错（转载）
最佳答案 报这个错是因为,提交了主键重复的数据,虽然未提交到数据库中 但是现在的EF上下文中已经包含了我提交的数据,下次在提交正确数据时, 原来添加到上下文中的数据依然还在..如何处理这个问题呢? ...