一。 JS简介
1. JavaScript概述
JavaScript 是世界上最流行的编程语言。这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
JavaScript是一种面向对象的，动态的脚本语言，主要被作为客户端脚本语言在用户的浏览器上运行，不需要编译即可运行，不需要服务器的支持。
JavaScript具有如下特点：
1) JavaScript 是脚本语言。
2) JavaScript是弱类型的语言。
3) JavaScript 是一种轻量级的编程语言。
4) JavaScript 是可插入HTML页面的编程代码。
5) JavaScript 插入HTML页面后，可由所有的现代浏览器执行。
而我们之前学习的C#语言是服务器端语言，需要运行在服务器上。
那么我们之前学习了C#语言，为什么还要学习JavaScript呢？因为随着社会的发展，打开浏览器来使用Web应用程序做一些业务处理已经成为主流，这也是B/S架构的应用程序取代C/S架构应用程序的原因所在。那么在浏览器里能被浏览器解析的网页语言就是HTML，由于HTML是静态的,不能处理动态的数据。而JavaScript可以操作HTML语言，实现动态数据交互功能。所以我们要学习JavaScript语言来弥补HTML语言的不足，实现动态数据的交互。
另外，在Web世界里，也只有JavaScript能跨平台、跨浏览器驱动网页，与用户交互。
那么，我们学习JavaScript语言需要哪些条件呢？
1) 首先要学习HTML语言，这是静态网页语言，用于在网页上显示相关静态信息。
2) 再者要学习CSS样式，这是一种可以让HTML呈现的内容样式更加丰富，能呈现各种各样的效果展示数据。
2. JavaScript简介
2.1. 写入HTML输出
在VS2013中创建一个空白的Web应用程序项目，ASP.NET Web应用程序是完全支持JavaScript代码的编写的。
然后创建一个HTML页面，如图2-1所示：
图2-1
在图2-1中选择“HTML页”，点击“添加”按钮。如图2-2所示：
图2-2
现在我们编写第一行JavaScript代码：
1 DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 5 <title>title> 6 <script type="text/javascript"> 7 document.write("你好！"); 8 script> 9 head> 10 <body> 11 body> 12 html>
从代码上可以看出来，JavaScript代码是与HTML代码混合在一起编写的。
1) 首先将如下代码段写在
标记内：1 <script type="text/javascript"> 2 ----JavaScript代码段 3 script>
也就是将
2.3. 其它window方法
这些属性有的是对open()打开的窗口生效。
1) window.open() ：打开新窗口。
2) window.close() ：关闭当前窗口。
function closeWin() {
window.close();
}
3) window.moveTo() ：移动窗口。
moveTo() 方法可把窗口的左上角移动到一个指定的坐标。
4) window.resizeTo() ：调整窗口的尺寸。
resizeTo()把窗口大小调整为指定的宽度和高度。
3. window.screen
window.screen 对象包含有关用户屏幕的信息。window.screen 对象在编写时可以不使用 window 这个前缀。
1) availHeight：获取屏幕（不是浏览器）的可用高度，不包括任务栏，单位是像素。
2) avaiWidth：获取屏幕（不是浏览器）的可用宽度，不包括任务栏，单位是像素。
3) colorDepth：返回屏幕的色彩，也就是屏幕调色板的比特深度，现在大部分都是24色。
4) height：返回屏幕的总高度，包括任务栏。
5) pixelDepth：返回屏幕颜色的分辨率，每像素的位数，例如：24位。
6) width：返回屏幕的总宽度，包括任务栏。
由于当前电脑的分辨率是1366*768，由于高度不包括任务栏，所以可用高度变成了728，这说明任务栏的高度是40。
4. window.location
window.location对象用于获得当前页面的地址 (URL)，并也可把浏览器重定向到新的页面。
1) hash：返回URL的锚部分，也就是URL含#及后面的内容。
2) host：返回URL的主机名和端口号：
3) hostname：返回URL的主机名：
4) port：返回URL的端口号：
5) protocol：返回URL的Web协议：
6) search：返回URL的查询部分:
4.1. href
使用window.location.href可以获取当前浏览器的完整页面地址。
也可以给location.href赋值URL地址实现页面的重定向。如下代码：
window.location.href = "http://baidu.com";
window.location.href = "HtmlPage1.html";
4.2. pathname
location.pathname 属性返回URL的路径名（不包含域名和端口号）。
4.3. assign
location.assign() 方法加载新的文档。
Location.assign()方法与location.href属性实现的效果是一样的，都是重定向到新的页面。
Location对象的其它方法和属性：
1) location.hostname 返回 web 主机的域名
2) location.pathname 返回当前页面的路径和文件名
3) location.port 返回 web 主机的端口 （80 或 443）
4) location.protocol 返回所使用的 web 协议（http:// 或 https://）
5. window.history
window.history对象包含浏览器的历史记录。
window.history 对象在编写时可不使用 window 这个前缀。
为了保护用户隐私，对 JavaScript 访问该对象的方法做出了限制。
常用的一些方法：
1) history.back() - 与在浏览器点击后退按钮相同，加载历史列表中的前一个 URL。
2) history.forward() - 与在浏览器中点击前进按钮向前相同，history.forward() 方法加载历史列表中的下一个 URL。
//后退
history.back();
//前进
history.forward();
3) history.go()：加载history列表中某个具体的页面，加载的页面必须是历史访问过的。
该参数可以是数字，使用的是要访问的 URL 在 History 的 URL 列表中的相对位置。（-1上一个页面，1下一个页面)。或一个字符串，字符串必须是局部或完整的URL，该函数会去匹配字符串的第一个URL。
go(-1): 返回上一页，原页面表单中的内容会丢失；
back(-1): 返回上一页，原页表表单中的内容会保留。
window.history.go(-2)表示后退2页。
6. window.navigator
window.navigator对象包含有关访问者浏览器的信息。
navigator.appName用于获取浏览器的名称。
1) appCodeName：返回浏览器的代码名，目前主流的浏览器(IE11/Edge/fireFox/Google Chrom)的appCodeName都是：Mozilla。
2) appName：返回浏览器的名称。目前主流的浏览器(IE11/Edge/fireFox/Google Chrom)的appName都是：Netscape。
3) appVersion：返回浏览器的平台和版本信息。每个浏览器返回的信息不一样。
FireFox
Edge
4) cookieEnabled：返回当前浏览器是否启用了Cookie。目前浏览器大都支持Cookie，返回true。
5) platform：返回运行浏览器的操作系统。如果运行的是windows操作系统，则返回Win32。
6) userAgent：返回客户端发送服务器的用户代理字符串。每个浏览器返回的值不太一样。
7. 弹窗
7.1. 警告框
JavaScript中的警告框使用window.alert()方法来实现。显示带有一段消息和一个确认按钮的警告框。
用户名：
7.2. 确认框
确认框使用confirm()方法表示，显示带有一段消息以及确认按钮和取消按钮的对话框。
注意：confirm()会返回一个布尔类型的值，如果返回的值为true，则表示用户点击了“确定”按钮，否则点击了“取消”或关闭按钮。
当点击了“确定”按钮。
7.3. 提示框
提示框使用prompt()方法表示，prompt()方法用于显示可提示用户进行输入的对话框。这个方法返回用户输入的字符串。
如果没有在文本框中输入任何内容，则接收的值为null。
7.4. 换行
在HTML中，可以使用的换行有：
，还可以使用
但是在JavaScript的所有弹窗中要使用换行，则要使用\n实现：
var x = window.prompt("请输入您的姓名:\n包含全名");
8. 计时事件
通过使用 JavaScript，我们有能力做到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。
8.1. setTimeout()方法
setTimeout()方法也称为超时调用。用于在指定的毫秒数之后执行一段JavaScript代码，只执行一次，其语法如下：
var t=setTimeout("javascript语句",毫秒)
注意：1000毫秒等于1秒。
案例：当按钮被点击时，一个提示框会在5秒中后弹出。
一般情况下，我们会给setTimeOut()方法第1个参数传递一个函数,而不是JS代码。如下代码：
8.2. clearTimeout()方法
如果要取消setTimeout()方法执行的代码，可以使用clearTimeout()。
clearTimeout()方法需要一个超时ID。
8.3. setInterval()和clearInterval()方法
setInterval() 方法可按照指定的周期（以毫秒计）来重复调用函数或计算表达式。
setInterval()也称为间隔调用。如果不停止，就是死循环，无限循环。
setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的ID值可用作 clearInterval() 方法的参数。
基本语法如下：
setInterval("javascript语句",毫秒)
案例：模拟时钟
三。 JavaScript HTML DOM操作
1. DOM简介
1.1. 基本概念
HTML DOM称为文档对象模型，当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）DOM。
HTML DOM 模型被构造为对象的树。
通过可编程的文档对象模型，JavaScript 获得了足够的能力来创建动态的 HTML。
1) JavaScript 能够改变页面中的所有 HTML 元素
2) JavaScript 能够改变页面中的所有 HTML 属性
3) JavaScript 能够改变页面中的所有 CSS 样式
4) JavaScript 能够对页面中的所有事件做出反应
1.2. 查找HTML元素
在JavaScript中，如果想要操作HTML元素，则首先必须要找到该元素，查找到HTML元素之后就变为对象，那么给对象赋值和获取值就可以操作HTML元素了。
JavScript能够操作HTML元素，就是通过DOM来实现的。
1.2.1. 通过id找到HTML元素
在HTML中，所有的标记都可以具有一个唯一的id值，通过这个id值就可以轻松的找到该HTML元素。
在DOM中查找HTML元素的最简单的方法，就是通过使用元素的 id值。如果未找到，则返回null，如果找到，则返回该元素的对象。如果存在id相同的，则只查找到第1个HTML元素。
基本语法如下：
var 变量名= document.getElementById("HTML元素的id值");
1.2.2. 通过标签名查找HTML元素
HTML标记的标签名是指某一类HTML元素，例如：p标签名表示所有的p元素，div标签名表示所有的div元素。
通过标签名可以在整个HTML DOM树中遍历所有的HTML元素，从而按标签名查找，返回的结果是一个包含相同标签名的元素集合。
基本语法如下：
var 集合名= document.getElementsByTagName("标签名");
注意：getElementsByTagName()方法返回的是一个包含多个元素的集合。
你好
Hello
可见，在图中，getElementsByTagName()返回的类型是HTMLCollection集合。其中的length属性可以获取一共查找到了多少个元素。通过索引值可以获取查找到的元素对象。索引值是从0开始的，当然也可以通过id值查找。HTMLCollection[“id”]。
1.2.3. 通过name查找HTML元素
通过HTML元素的name属性值查找HTML元素，使用getElementsByName() 方法。由于在HTML代码中，有的元素的name值可能会相同，所以
getElementsByName()方法返回的是一个NodeList集合。
1.2.4. 通过类名找到HTML元素
这里说的类名是指CSS中的类名。这样我们就可以通过CSS的类名来查找HTML元素，使用getElementsByClassName()方法，返回的是一个HTMLCollection集合。
基本语法如下：
var 集合名= document.getElementsByClassName("类名");
2. DOM HTML
HTML DOM允许JavaScript改变HTML元素的内容。
1) 改变HTML输出流
在JavaScript中，使用document.write() 可直接向 HTML 输出流写内容。注意：document.write()会将页面上原来的内容全部覆盖掉。
document.write(new Date().toDateString());
2) 改变HTML内容
对于HTML元素的内容，可以使用innerHTML和innerText这两个属性获取或赋值。
innerHTML属性可以设置带有html标记的内容：
div1.innerHTML= "你好";
innerText属性只能设置纯文本内容：
div1.innerText = "你还好吗？";
3) 改变HTML属性的值
改变HTML属性是指可以修改属性的值，从而达到不同的效果。
//将div1元素的id值修改为div2
div1.id = "div2";
最常用的还有一种就是改变图片的地址，从而达到切换图片的效果：
document.getElementById("img1").src = "/Images/003.png";
3. DOM CSS
HTML DOM允许JavaScript改变HTML元素的样式。
要想改变HTML元素的样式，则还是需要查找到该元素，然后使用如下语法改变样式：
document.getElementById(id).style.属性名=新样式
4. DOM 事件
4.1. 基本概念
HTML DOM使JavaScript有能力对HTML事件做出反应。可以在事件发生时执行JavaScript代码，例如当用户在HTML元素上点击时。
HTML具有的事件如下：
1) 当用户点击鼠标时
2) 当网页已加载时
3) 当图像已加载时
4) 当鼠标移动到元素上时
5) 当输入字段被改变时
6) 当提交 HTML 表单时
7) 当用户触发按键时
4.2. HTML事件属性
如需向HTML元素分配事件，可以使用事件属性，事件属性大都以on开头。
在VS开发工具中，所有以闪电图标出现的都是事件。
事件属性的值都是以函数的形式出现的，也就是直接调用函数。
4.3. 使用HTML DOM来分配事件
HTML DOM 允许通过使用JavaScript来向HTML元素分配事件。在上图中，我们都是直接在HTML标记上写事件属性，是在HTML代码中指定的。当然也可以在Js代码中指定：
在此代码中，使用JS代码给按钮分配了onclick事件属性，并且还指定事件代码，是一个匿名的函数。
在这里，我们将JS代码放在了按钮的后面，这是因为JS代码首先要查找按钮，只有查找到之后才可以分配事件。
4.4. onload和onunload事件
onload 和 onunload 事件会在用户进入或离开页面时被触发。
onload 事件可用于检测访问者的浏览器类型和浏览器版本，并基于这些信息来加载网页的正确版本。
onload 和 onunload 事件可用于处理 cookie。
一般会在
标记上使用onload和onunload事件。4.5. onchange事件
onchange事件常结合对输入字段的验证来使用。
当输入的内容发生改变时则触发onchange事件。
用户名:
4.6. onmouseover 和 onmouseout 事件
onmouseover和onmouseout事件可用于在用户的鼠标移至HTML 元素上方或移出元素时触发函数。
上图是默认的效果。
上图是鼠标移至文本框上之后触发了onmouseover事件，执行了overColor()函数中的代码。
上图是鼠标离开了文本框时触发了outColor()事件。
4.7. onmousedown、onmouseup 以及 onclick 事件
onmousedown, onmouseup 以及 onclick 构成了鼠标点击事件的所有部分。首先当点击鼠标按钮时，会触发 onmousedown 事件，当释放鼠标按钮时，会触发 onmouseup 事件，最后，当完成鼠标点击时，会触发 onclick 事件。
注意：鼠标按下、鼠标释放包括左键和右键。但对于onclick事件，则只是鼠标左键单击时触发。
4.8. ondblclick事件
ondblclick表示双击事件，双击鼠标左键来执行事件代码。
5. DOM EventListener
5.1. addEventListener()方法基本概念
addEventListener() 方法用于向指定元素添加事件句柄。
addEventListener() 方法添加的事件句柄不会覆盖已存在的事件句柄。
可以向一个元素添加多个事件句柄。可以向同个元素添加多个同类型的事件句柄，如：两个 "click" 事件。
可以向任何 DOM 对象添加事件监听，不仅仅是 HTML 元素。如： window 对象。
addEventListener() 方法可以更简单的控制事件（冒泡与捕获）。
当使用 addEventListener() 方法时, JavaScript 从 HTML 标记中分离开来，可读性更强， 在没有控制HTML标记时也可以添加事件监听。
基本语法如下：
元素对象.addEventListener(event, function, useCapture);
第一个参数是事件的类型 (如 "click" 或 "mousedown"，不需要前缀on)。
第二个参数是事件触发后调用的函数。
第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。
5.2. 向元素添加事件句柄
要给元素添加事件，首先需要查找到该元素，然后使用addEventListener()方法添加事件。
addEventListener() 方法允许向同个元素添加多个事件，且不会覆盖已存在的事件。
5.3. 向window对象添加事件句柄
addEventListener() 方法允许在 HTML DOM 对象上添加事件监听， HTML DOM 对象如： HTML 元素, HTML 文档, window 对象。或者其他支持的事件对象如: xmlHttpRequest 对象。
当用户重置窗口大小时添加事件监听：
window.addEventListener("resize", function(){
document.getElementById("demo").innerHTML = sometext;
});
这说明可以直接给window对象添加监听事件。
5.4. 传递参数
当传递参数值时，使用"匿名函数"调用带参数的函数：
元素对象.addEventListener("click", function(){ myFunction(p1, p2); });
5.5. removeEventListener()方法
removeEventListener() 方法移除由 addEventListener() 方法添加的事件句柄:
element.removeEventListener("mousemove", myFunction);
5.6. 冒泡事件和捕获事件
事件传递有两种方式：冒泡与捕获。
事件传递定义了元素事件触发的顺序。 如果你将
元素插入到
元素, 哪个元素的 "click" 事件先被触发呢？
在 冒泡 中，内部元素的事件会先被触发，然后再触发外部元素，即：
元素的点击事件先触发，然后会触发
在 捕获 中，外部元素的事件会先被触发，然后才会触发内部元素的事件，即：
元素的点击事件。
addEventListener() 方法可以指定 "useCapture" 参数来设置传递类型：
addEventListener(event, function, useCapture);
默认值为 false, 即冒泡传递，当值为 true 时, 事件使用捕获传递。
5.7. 浏览器支持情况
IE 8 及更早 IE 版本，Opera 7.0及其更早版本不支持 addEventListener() 和 removeEventListener() 方法。但是，对于这类浏览器版本可以使用 detachEvent() 方法来移除事件句柄:
element.attachEvent(event, function);
element.detachEvent(event, function);
通用跨浏览器的添加事件句柄方法：
var x = document.getElementById("myBtn");
if (x.addEventListener) { // 所有主流浏览器，除了 IE 8 及更早版本
x.addEventListener("click", myFunction);
} else if (x.attachEvent) { // IE 8 及更早版本
x.attachEvent("onclick", myFunction);
}
6. DOM元素操作
6.1. 添加新的HTML元素
如需向 HTML DOM 添加新元素，必须首先创建该元素（元素节点），然后向一个已存在的元素追加该元素。
JavaScript都是使用appendChild()方法来添加子元素的。
6.2. 删除HTML元素
如需删除 HTML 元素，必须首先获得该元素的父元素对象，然后再查找到要删除的子元素对象。
使用removeChild()方法从父元素中移除子元素。
你好
四。JS类型转换，简单验证及JS CSS
1. JavaScript类型转换
JavaScript 是一个脚本语言。它是一个轻量级，功能强大的编程语言，并且是面向对象的语言。
JavaScript是弱类型，松散类型的，只能使用关键字var来定义变量。如：
在JavaScript中，由于是弱类型的，所以给x1最初赋值为100，后来又赋值为字符串”ABC”，这在JavaScript中是允许的，而C#中是绝对不允许的。
那么最终x1的值就是”ABC”了。
输出一下结果：
1.1. JavaScript数据类型
JavaScript中的数据类型分为：基本数据类型和引用数据类型。其中基本数据类型有String、Number、Boolean。而引用类型有object、Date、Array等。
1) 数值使用Number表示，可以用来表示整数、小数或科学计数法，不像C#分的那么细。
在JavaScript中，使用parseInt()转换为整数，parseFloat()转换为小数。true转NaN,false转NaN。””字符串转为NaN，非数字字符串转为NaN。
Number()也强制类型转换。转换规则与parseInt()是不一样的
var n = 200;
//字符串形式的数值转换为整数
var nx = parseInt("200");
//字符串形式的数值转换为小数
var nf = parseFloat("29.65");
2) 字符串使用String表示，需要使用单引号或双引号括起来，而C#只能使用双引号括起来。
//String
var s1 = "ABC";
var s2 = 'ABC';
3) 布尔类型使用Boolean表示，只能是true或false。
//Boolean
var b1 = false;
var b2 = true;
4) 数组使用Array表示，定义一个数组需要使用new关键字，数组对象是引用类型。定义的数组没有赋值，默认为undefined。
//Array
var array1 = new Array();
//赋值
array1[0] = "ABCV";
array1[1] = 100;
//可以使用[]
var array2 = ["ABCV", 100];
5) 对象使用Object表示，定义一个对象，也需要new关键字。Object是引用类型。
//Object
var o1 = new Object();
//添加属性
o1.name = "小明";
o1.age = 22;
o1.sex = '男';
//对象字面量表示法，使用冒号:将属性和属性值分开,每个属性使用逗号分开
var o2 = { name: "小明", age: 22, sex: "男" };
6) 函数使用Function表示， JavaScript函数与C#中的方法有相似之处。函数可以有返回值，需要使用return语句，但是不需要指定返回类型。函数的参数是任意的。
定义一个函数需要使用function关键字：
//function
//不带参数
function f1() {
document.write("你好");
}
//带参数，没有类型，只有参数名
function f2(name, age, sex) {
var x = name + age + sex;
document.write(x);
}
//也可以这样定义
var f3 = function () {
var x2 = "123";
document.write(x2);
}
7) 日期使用Date表示，Date是引用类型，使用时需要使用new关键字实例化。如下代码：
//Date日期类型
var d = new Date();
document.write(d);
下面是Date常用的方法：
| Date() |
|
返回当日的日期和时间。 |
| getDate() |
|
从 Date 对象返回一个月中的某一天 (1 ~ 31)。 |
| getDay() |
|
从 Date 对象返回一周中的某一天 (0 ~ 6)。 |
| getMonth() |
|
从 Date 对象返回月份 (0 ~ 11)。 |
| getFullYear() |
|
从 Date 对象以四位数字返回年份。 |
| getYear() |
|
请使用 getFullYear() 方法代替。 |
| getHours() |
|
返回 Date 对象的小时 (0 ~ 23)。 |
| getMinutes() |
|
返回 Date 对象的分钟 (0 ~ 59)。 |
| getSeconds() |
|
返回 Date 对象的秒数 (0 ~ 59)。 |
| getMilliseconds() |
|
返回 Date 对象的毫秒(0 ~ 999)。 |
| getTime() |
|
返回 1970 年 1 月 1 日至今的毫秒数。 |
8) 数学对象使用Math表示，不需要实例化，可以直接使用。如下代码：
//数学对象
var m = Math.tan(23);
document.write(m);
Math对象常用的方法：
| abs(x) |
返回数的绝对值。 |
| ceil(x) |
对数进行上舍入。 |
| floor(x) |
对数进行下舍入。 |
| max(x,y) |
返回 x 和 y 中的最高值。 |
| min(x,y) |
返回 x 和 y 中的最低值。 |
| random() |
返回 0 ~ 1 之间的随机数。 |
| round(x) |
把数四舍五入为最接近的整数。 |
9) null类型，表示空引用。
10) undefined类型，表示未定义值，如定义的变量没有赋值，则就是undefined。
1.2. JavaScript变量
变量用于存储数据值。JavaScript使用关键字var来定义变量， 使用等号来为变量赋值：
1.3. JavaScript语句
在HTML中，JavaScript语句是向浏览器发出的命令。JavaScript语句是用分号结尾的，可以省略分号。但不建议这样做，当对JS代码进行压缩时，省略分号就不允许了。
1.4. JavaScript关键字
JavaScript关键字用于标识要执行的操作，和其他任何编程语言一样，JavaScript 保留了一些关键字为自己所用。
下面是JavaScript中的关键字：
1.5. JavaScript标识符
JavaScript标识符必须以字母、下划线（_）或美元符（$）开始。
后续的字符可以是字母、数字、下划线或美元符（数字是不允许作为首字符出现的）。
JavaScript中的标识符是区分大小写的，与C#一样。
1.6. JavaScript注释
JavaScript中的注释分为单行注释和多行注释。注释是不
1) 单行注释使用//表示，只能注释一行代码，与C#是完全一样的。
//定义单价
var price = 200.87;
2) 多行注释使用/* */表示，可以同时注释多行代码，与C#也是完全一样的。
//多行注释
/*
var a = 100;
var b = 200;
var c = 300;
*/
1.7. typeof操作符
使用typeof()操作符是数据类型检测方法，可以据值来检测是什么数据类型。如下代码：
运行结果如下：
1.8. 运算符和表达式
1、算术运算符： + - * / % ++ --
2、赋值运算符：= += -=
3、比较运算符：> < >= <= == !=
4、逻辑运算符：&& || !
5、类型检测运算符
typeof（），检索数据类型，返回数据类型
IsNaN(),判断是否是非数字，返回true或false，非数字返回true。
1.9. 数据类型转换
1) 任何数据转换为字符串类型，可以使用toString()方法和String()方法。
2) 任何数据转换为整数可以使用Number()函数和parseInt()方法。
3) 任何数据转换为小数可以使用Number()函数和parseFloat()方法。
4) 任何数据转换为布尔类型，则使用Boolean()函数。0转换为false，非0转换为true。Null、undefined都是false，空字符串为false，非空字符串为true。
2. JavaScript表单验证
可以使用C#中的一些非空判断技巧用在JavaScript表单验证中。
目标：练习JavaScript给文本框赋值和取值，并进行非空判断。
【项目案例】：获取用户名和密码
【项目背景】：登录是项目中常见的效果，比如上淘宝网购物，登录QQ，都要先登录，才能获取用户信息，那么我首先来实现登录时如何获取用户信息。
完整代码如下：
用户信息注册
用户名：
密 码：
五。正则表达式语法
1. 正则表达式
1.1. 概念
正则表达式（英语：Regular Expression，在代码中常简写为regex、regexp或RE）使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。
搜索模式可用于文本搜索和文本替换。
1.2. 什么是正则表达式
1) 正则表达式是由一个字符序列形成的搜索模式。
2) 当你在文本中搜索数据时，你可以用搜索模式来描述你要查询的内容。
3) 正则表达式可以是一个简单的字符，或一个更复杂的模式。
4) 正则表达式可用于所有文本搜索和文本替换的操作。
2. 正则表达式语法
JavaScript正则表达式字面量表示法的语法如下：
/模式/[修饰符]
例如：var patt = /BaWei/i;
其中，/BaWei/i是一个正则表达式，BaWei是一个搜索模式，用于检索。i是一个修饰符，i表示不区分大小写进行匹配。
3. 字符串方法
在 JavaScript 中，正则表达式通常用于两个字符串方法 : search() 和 replace()。
3.1. search()方法
search()方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回第一个匹配的子字符串的起始位置。未搜索到，则search()方法返回-1。
3.1.1. search()方法使用正则表达式
在此代码中，/BaWei/i是一个正则表达式，表示在字符串中搜索是否存在BaWei，i表示不区分大小写，如果匹配到了，则返回相应的索引值，如果没有匹配到，则返回-1。
3.1.2. search()方法使用字符串
search方法可使用字符串作为参数。字符串参数会转换为正则表达式。
3.2. replace()方法
replace()方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子字符串。
注意：如果不使用g修饰符，则只替换第一个匹配到的字符串。如果使用g修饰符，则全部匹配替换。
3.2.1. replace()方法使用正则表达式
案例：使用正则表达式且不区分大小写将字符串中的 Microsoft 替换为 BaWei。
replace()方法的参数说明如下：
1) 第1个参数可以是查找的字符串，也可以是一个正则表达式。
2) 第2个参数是最终要替换为的新字符串。
3) 功能是将第1个参数匹配到的值替换为第2个参数的值。
4) 返回的结果就是替换后的新字符串。
3.2.2. replace()方法使用字符串
replace()方法的第一个参数除了使用正则表达式之外，还可以使用字符串。
3.3. exec()方法
exec() 方法是一个正则表达式方法。用于在正则表达式中。
exec() 方法用于检索字符串中的正则表达式的匹配。
该函数返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。
3.4. test()方法
test() 方法是一个正则表达式方法。
test() 方法用于检测一个字符串是否匹配某个模式，如果字符串中含有匹配的文本，则返回 true，否则返回 false。
以下实例用于搜索字符串中的字符 "a"：
4. 正则表达式修饰符
4.1. /g修饰符和match()方法
/g修饰符，表示执行全局匹配，并不是所有与正则表达式相关的函数都支持全局匹配，例如：search()方法就不支持/g修饰符，而match()和replace()方法就支持/g。
字符串match()方法使用正则表达式模式对字符串执行查找，并将包含查找的结果作为数组Array返回。
4.2. /m修饰符
/m表示多行查找，常用于^和$匹配中，^表示开头，$表示结尾。
一般情况下，m和g配合使用才有意义。
只查找到了一个。
使用/gm，全局多行查找。
4.3. /i修饰符
/i修饰符表示不区分大小写匹配。
没有找到。
5. 正则表达式模式
六。JavaScript RegExp对象
1. 语法
RegExp对象表示正则表达式对象，它是对字符串执行模式匹配的强大工具。
1.1. 直接量(字面量)表示法
在上一节我们学习了直接量（或字面量）表示法使用正则表达式，基本语法如下：
/pattern/attributes
参数pattern是一个字符串，指定了正则表达式的模式或其他正则表达式。
参数attributes是一个可选的字符串，包含属性 "g"、"i" 和 "m"，分别用于指定全局匹配、区分大小写的匹配和多行匹配。ECMAScript 标准化之前，不支持 m 属性。如果 pattern 是正则表达式，而不是字符串，则必须省略该参数。
1.2. RegExp对象
使用regExp对象可以更加灵活的操作正则表达式，基本语法如下：
new RegExp(pattern, attributes);
new RegExp(正则表达式,修饰符);
参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。
参数 attributes 是一个可选的字符串，包含属性 "g"、"i" 和 "m"，分别用于指定全局匹配、区分大小写的匹配和多行匹配。ECMAScript 标准化之前，不支持 m 属性。如果 pattern 是正则表达式，而不是字符串，则必须省略该参数。
2. 修饰符
注意：search()方法不支持g修饰符标志，而replace()和match()方法支持g修饰符标志。
3. 方括号
方括号用于查找某个范围内的字符。
var str = "abcd";
var patt1 = /[^abc]/g;
document.write(str.match(patt1));
var str = "a123";
var patt1 = /[^abc]/g;
document.write(str.match(patt1));
4. 元字符
var patt2 = /a.b/gi;
var str1 = "a1b";
document.write(patt2.test(str1));
var patt2 = /a.b/gi;
var str1 = "aMb";
document.write(patt2.test(str1));
var patt3 = /a\wb/gi;
var str2 = "aHb";
document.write(patt3.test(str2));
对于\w，数字、字母和下划线都是可以的。
var patt3 = /a\wb/gi;
var str2 = "a&b";
document.write(patt3.test(str2));
对于\b的使用，匹配单词边界：
/\bm/ 匹配 "moon" 中的 'm'；
/oo\b/ 不匹配 "moon" 中的 'oo'，因为 'oo' 后面的 'n' 是一个单词字符；
/oon\b/ 匹配 "moon" 中的 'oon'，因为 'oon' 位于字符串的末端，后面没有单词字符；
/\w\b\W/ 不匹配任何字符，因为单词字符之后绝不会同时紧跟着非单词字符和单词字符。
5. 量词
6. RegExp对象方法
常用正则表达式
验证数字：^[0-9]*$
验证n位的数字：^\d{n}$
验证至少n位数字：^\d{n,}$
验证m-n位的数字：^\d{m,n}$
验证零和非零开头的数字：^(0|[1-9][0-9]*)$
验证有两位小数的正实数：^[0-9]+(.[0-9]{2})?$
验证有1-3位小数的正实数：^[0-9]+(.[0-9]{1,3})?$
验证整数和一位小数:^[0-9]+(.[1-9]{1})?$
验证非零的正整数：^\+?[1-9][0-9]*$
验证非零的负整数：^\-[1-9][0-9]*$
验证非负整数（正整数 + 0） ^\d+$
验证非正整数（负整数 + 0） ^((-\d+)|(0+))$
验证长度为3的字符：^.{3}$
验证由26个英文字母组成的字符串：^[A-Za-z]+$
验证由26个大写英文字母组成的字符串：^[A-Z]+$
验证由26个小写英文字母组成的字符串：^[a-z]+$
验证由数字和26个英文字母组成的字符串：^[A-Za-z0-9]+$
验证由数字、26个英文字母或者下划线组成的字符串：^\w+$
验证用户密码:^[a-zA-Z]\w{5,17}$ 正确格式为：以字母开头，长度在6-18之间，只能包含字符、数字和下划线。
验证是否含有 ^%&',;=?$\" 等字符：[^%&',;=?$\x22]+
验证汉字：^[\u4e00-\u9fa5]+$
验证Email地址：^(\w)+(\.\w+)*@(\w)+((\.\w{2,3}){1,3})$
验证InternetURL：^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$ ；^[a-zA-z]+://(w+(-w+)*)(.(w+(-w+)*))*(?S*)?$
验证电话号码：^(\(\d{3,4}\)|\d{3,4}-)?\d{7,8}$：--正确格式为：XXXX-XXXXXXX，XXXX-XXXXXXXX，XXX-XXXXXXX，XXX-XXXXXXXX，XXXXXXX，XXXXXXXX。
验证身份证号（15位或18位数字）：^\d{15}|\d{}18$
验证一年的12个月：^(0?[1-9]|1[0-2])$ 正确格式为：“01”-“09”和“1”“12”
验证一个月的31天：^((0?[1-9])|((1|2)[0-9])|30|31)$ 正确格式为：01、09和1、31。
整数：^-?\d+$
非负浮点数（正浮点数 + 0）：^\d+(\.\d+)?$
正浮点数 ^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$
非正浮点数（负浮点数 + 0） ^((-\d+(\.\d+)?)|(0+(\.0+)?))$
负浮点数 ^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$
浮点数 ^(-?\d+)(\.\d+)?
0-100之间的数，小数点后面最多两位^(?:(?!0\d)\d{1,2}(?:\.\d{1,2})?|100(?:\.0{1,2})?)
转载于:https://www.cnblogs.com/linjierd/p/10103457.html