一、驗證表單 封裝一個函數用於驗證手機號 /** * @param {String}eleId * @param {Object}reg */ function checkInput(eleId,reg) { var ele = document.getElementById(eleId); ele ...
一、驗證表單
- 封裝一個函數用於驗證手機號
/**
* @param {String}eleId
* @param {Object}reg
*/
function checkInput(eleId,reg) {
var ele = document.getElementById(eleId);
ele.onblur = function (ev) {
if(!reg.test(this.value)){ //不匹配
this.style.borderColor = "#ff0000" //紅色
}else{ //匹配
this.style.borderColor = "#cccccc" //白色
}
}
}
//驗證手機號
checkInput("phone",/^13[0-9]\d{8]$/)
二、WebsAPI
- JavaScript包含ECMAScript和WebAPIs
- WebAPIs包含BOM和DOM
- BOM:瀏覽對象模型
- DOM：文檔對象模型：（1）一套操作頁面元素的API（2）DOM可以把HTML看作文檔樹，通過DOM提供的API可以對樹上的節點進行操作。
1.DOM
- 基本概念：文檔對象模型（Document Object Model），是W3C組織推薦的處理可擴展標記用語言的編程介面
- 他是一種與平臺和語言無關的應用程式介面，它可以動態地訪問程式和腳本，更新其內容、結構和文檔風格。
- DOM又稱為文檔樹模型
- 文檔：一個網頁可以成為文檔
- 節點：網頁中所有的內容都是節點（標簽、屬性、文本、註釋等）
- 元素：網頁中地標簽，例如：<html>,<head>,<div>
- 屬性：標簽的屬性。例如：href,width,length
- DOM常用操作：
- 獲取文檔元素
- 對文檔元素進行增刪改查操作
- 事件操作
2.window對象
- 所有地瀏覽器都支持window對象，它支持瀏覽器視窗。
- 所有的js全局對象，函數以及變數都能自動成為window對象地成員。
- 全局變數是window對象的屬性，全局函數是window對象的方法。
3.document對象
- document也是window對象地屬性之一；
- document對象是documentHTML的一個實例，也是window對象的一個屬性，因此可以將document對象作為一個全局對象來訪問。
<div id = "testDiv">測試一個div</div>
<script>
var str = "jdi";
console.log(window.str);
console.log(document);
console.log(document === window.document);
console.log(document.childNodes);
console.log(document.head);
console.log(document.body);
console.log(document.title);
var box = document.getElementById("testDiv");
console.log(box);
console.log(box.innerText);
</script>
運行結果：
三、源碼：
- D26_1_FormVerification.html
- 地址:
https://github.com/ruigege66/JavaScript/blob/master/D26_1_FormVerification.html - 博客園：
https://www.cnblogs.com/ruigege0000/ - CSDN：
https://blog.csdn.net/weixin_44630050?t=1 - 歡迎關註微信公眾號：傅里葉變換，個人賬號，僅用於技術交流，後臺回覆“禮包”獲取Java大數據學習視頻禮包
