首页 > 代码库 > 20141124-HTML-JavaScrilpt

20141124-HTML-JavaScrilpt

JavaScript

JavaScript(简称JS),他是一门HTML的脚本语言,用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。

他的用法及语法类似于Visual Studio 2012(简称VS)。注释的格式/*.注释一段.*/  //注释一行

JS的写入HTML的输出语句是:

<script>    document.write("要显示的内容")</script>

1.在网页上的显示:

image

2.JS可以对事件作出反应,比如点击按钮:

alert() 函数在 JavaScript 中并不常用,但它对于代码测试非常方便。

onclick 的意思 是点击事件。

alert  onclick都是JS里的语句,它们可以不用专门包裹在<script></script>之间。

<button type="button" onclick="alert(‘欢迎来到这里!‘)">点击按钮</button>

点击按钮后显示:

image

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>

image点击后:image

同理可以修改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>

image

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