20141124-HTML-JavaScrilpt
JavaScript
JavaScript(简称JS),他是一门HTML的脚本语言,用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。
他的用法及语法类似于Visual Studio 2012(简称VS)。注释的格式/*.注释一段.*/ //注释一行
JS的写入HTML的输出语句是:
<script>
document.write("要显示的内容")
</script>
1.在网页上的显示:
2.JS可以对事件作出反应,比如点击按钮:
alert() 函数在 JavaScript 中并不常用,但它对于代码测试非常方便。
onclick 的意思 是点击事件。
alert onclick都是JS里的语句,它们可以不用专门包裹在<script></script>之间。
<button type="button" onclick="alert('欢迎来到这里!')">点击按钮</button>
点击按钮后显示:
3.JS可以改变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的元素样式:
加入代码 x.style.color="#ff0000";
<p id="demo">
JavaScript 能改变 HTML 元素的内容。
</p> <script>
function myFunction()
{
x=document.getElementById("demo"); // 找到元素
x.innerHTML="Hello JavaScript!"; // 改变内容
x.style.color="#ff0000"; //红色
}
/script> <button type="button" onclick="myFunction()">点击这里</button>
4.JS验证输入
<p>请输入数字。如果输入值不是数字,浏览器会弹出提示框。</p> <input id="demo" type="text"> <script>
function myFunction()
{
var x=document.getElementById("demo").value;/*(根据id)获取输入框中的的值*/
if(x==""||isNaN(x))/*NaN,不是数字,返回true(表示不是数字)或者false(表示是数字) */
{
alert("不是数字");/*弹出对话框*/
}
}
</script> <button type="button" onclick="myFunction()">点击这里</button>
JavaScript 对大小写是敏感的。
当编写 JavaScript 语句时,请留意是否关闭大小写切换键。
函数 getElementById 与 getElementbyID 是不同的。
同样,变量 myVariable 与 MyVariable 也是不同的。
20141124-HTML-JavaScrilpt的更多相关文章
- [20141124]sql server密码过期,通过SSMS修改策略报错
背景: 新建了用户,没有取消掉强制密码策略 修改掉策略报错 错误: The CHECK_POLICY and CHECK_EXPIRATION options cannot be turned OFF ...
- 不定义JQuery插件,不要说会JQuery 分类: JavaScript 2014-11-24 14:18 155人阅读 评论(0) 收藏
一:导言 有些WEB开发者,会引用一个JQuery类库,然后在网页上写一写$("#"),$("."),写了几年就对别人说非常熟悉JQuery.我曾经也是这样的人 ...
- [再寄小读者之数学篇](2014-11-24 Abel 定理)
设幂级数 $\dps{g(x)=\sum_{n=0}^\infty a_nx^n}$ 在 $|x|<1$ 内收敛, 且 $\dps{\sum_{n=0}^\infty a_n=s}$ 收敛. 则 ...
- RHEL7 CentOS7 检查查看精简指令
RHEL7 CentOS7 检查查看精简指令: //////////////////////////检查查看精简指令://///////////////////////////// ///////// ...
- oracle表分区详解(按天、按月、按年等)
分区表的概念: 当表中的数据量不断增大,查询数据的速度就会变慢,应用程序的性能就会下降,这时就应该考虑对表进行分区.表进行分区后,逻辑上表仍然是一张完整的表,只是将表中的数据在物理上存放到多个表空间 ...
- Android程序crash处理
Android程序crash处理 时间 2014-11-24 13:45:37 CSDN博客 原文 http://blog.csdn.net/allen315410/article/details ...
- oracle一条sql语句统计充值表中今天,昨天,前天三天充值记录
select NVL(sum(case when create_date_time>=to_date('2014-11-24 00:00:00','yyyy-mm-dd hh24:mi:ss') ...
- Android Studio系列教程五--Gradle命令详解与导入第三方包
Android Studio系列教程五--Gradle命令详解与导入第三方包 2015 年 01 月 05 日 DevTools 本文为个人原创,欢迎转载,但请务必在明显位置注明出处!http://s ...
- js数组到后台转 list数组
前台的数组格式是: [{"credit_record_certificate_id":"452","credit_record_type": ...
- Android Studio And Gradle
AS特色: 智能感知体验特好,堪比VS 布局预览,手写布局后预览页面即时显示,便于布局调整和优化 编辑速度飞快流畅,毫无eclipse的卡顿 布局或源码中有图标和颜色的预览,十分直观 调试时体验极佳 ...
随机推荐
- 一个小巧的C++Log输出到文件类 (转)
http://blog.csdn.net/dpsying/article/details/17122739 有时候需要输出一些程序运行的信息,供我们不需要调试就可以直接查看程序运行状态.所以我们需 ...
- 手把手教你使用 Imagepro plus - 宏操作【转】
Imagepro plus操作5 – 提高测量效率的必须技术-宏操作(续) 星期三, 七月 7th, 2010 | 图像分析 | hbchendl | 浏览:897 请先参阅:Imagepro plu ...
- 怎样基于android4.4.2的源代码和android-4.3.1_r1的驱动编译I9250的ROM
怎样基于android4.4.2的源代码和android-4.3.1_r1的驱动编译I9250的ROM 作者:雨水 2014-05-04 联系方式:dennis.hu.cd at gmail.com ...
- [Angular 2] Controlling Rx Subscriptions with Async Pipe and BehaviorSubjects
Each time you use the Async Pipe, you create a new subscription to the stream in the template. This ...
- KFC数据测试hbase结果
两个field,一个是KFC数据 一个列放的内容是“same” 每条数据都flush SLF4J: Failed to load class "org.slf4j.impl.Static ...
- Golang学习 - sort 包
------------------------------------------------------------ // 满足 Interface 接口的类型可以被本包的函数进行排序. type ...
- QQ上传大文件为什么这么快
今天和同事在群里讨论“QQ上传大文件/QQ群发送大文件时,可以在极短的时间内完成”是如何做到的. 有时候我们通过QQ上传一个几百M的文件,竟然只用了几秒钟,从带宽上限制可以得出,实际上传文件是不可能的 ...
- Data Structure 之 算法设计策略
1. 穷举法 基本思想:列举问题的所有可能解,并用约束条件逐一进行判定,找出符合约束条件的解. 穷举法的关键在于问题的可能解的列举和可能解的判别. 例如:凑数问题 2. 递归技术 定义:直接或间接调用 ...
- AliasRegistry接口
Spring - 4.2.3 // 将一个name注册为一个别名aliasvoid registerAlias(String name, String alias);// 移除一个别名aliasvoi ...
- 通过uiview动画来放大图片
UIImage *image=[UIImage imageNamed:"]; UIImageView *imageView=[[UIImageView alloc]init]; imageV ...