AngularJS代码示例

2017-04-26 21:52:00
admin
原创 1556
摘要:AngularJS代码示例

一、AngularJS代码示例

webapp项目结构:

  lib js库

  static 静态html、css、jpg等

  WEB-INF 动态内容

  index.html

  index.jsp


<!DOCTYPE html>申明:H5按标准方式来渲染。


二、JS基本语法

1 <script>和</script>会告诉JavaScript 在何处开始和结束,老式浏览器要求type="text/javascript",但现在已经不必。

2 JS可以位于head、可以位于body、也可以位于外部,但最好放在head或者外部便于维护。

3 JS常用对象:内置对象,浏览器对象,HTML DOM对象。

4 注释单行注释//,多行注释/**/


三、基本语法进阶

1 变量申明

注意:一次可以申明多个变量,重新申明变量变量值不会丢失。

注意:方法内申明变量加var为局部变量,不加var为全局变量;方法外无区别。

var def;
console.log(def); //值为undefined
console.log(undef); //没有变量,会出错。


2 变量类型(常用7种类型)

注意:JS类型为动态类型,即同一个变量可以作用不同的类型。

字符串类型

数字类型(只有一种数字类型,可以带小数,也可以不带)

布尔类型(true false

undefined(表示不含有值)和null(用于清空变量),undefined和null是不同的。


数组类型:

var cars=new Array();
cars[0]="Audi";
cars[1]="BMW";
cars[2]="Volvo";


对象类型:

var person={firstname:"Bill", lastname:"Gates", id:5566};

name=person.lastname;
name=person["lastname"];


类型申明:

var carname=new String;
var x=      new Number;
var y=      new Boolean;
var cars=   new Array;
var person= new Object;


四、JS输出

window.alert

<script>
window.alert(5 + 6);
</script>


操作HTML元素

document.getElementById("demo").innerHTML = "段落已修改。";


写到HTML文档

注意:如果在文档已完成加载后执行document.write,整个HTML页面将被覆盖。

document.write(Date());


写到控制台(浏览器F12,Console)

a = 8;
b = 6;
c = a + b;
console.log(c);


五、JS代码示例

1 显示时间

function displayDate() {
document.getElementById("demo").innerHTML = Date();
}
<p id="demo">这是一个段落</p>
<button type="button" onclick="displayDate()">显示日期</button>


2 改变样式

x=document.getElementById("demo")  //找到元素 
x.style.color="#ff0000";           //改变样式


3 弹框(常用于调试)

<button type="button" onclick="alert('欢迎!')">点我!</button>

发表评论
评论通过审核之后才会显示。