首頁 > 開發者 > JavaScript
標籤：javascript基礎
javascript 字串
字串是由字元組成的數組，但在JavaScript中字串是不可變的：可以訪問字串任意位置的文本，但是JavaScript並未提供修改已知字串內容的方法
常見功能：
obj.length 長度 obj.trim() 移除空白obj.trimLeft()obj.trimRight)obj.charAt(n) 返回字串中的第n個字元obj.concat(value, ...) 拼接obj.indexOf(substring,start) 子序列位置obj.lastIndexOf(substring,start) 子序列位置obj.substring(from, to) 根據索引擷取子序列obj.slice(start, end) 切片obj.toLowerCase() 大寫obj.toUpperCase() 小寫obj.split(delimiter, limit) 分割obj.search(regexp) 從頭開始匹配，返回匹配成功的第一個位置(g無效)obj.match(regexp) 全域搜尋，如果正則中有g表示找到全部，否則只找到第一個。obj.replace(regexp, replacement) 替換，正則中有g則替換所有，否則只替換第一個匹配項， $數字：匹配的第n個組內容； $&：當前匹配的內容； $`：位於匹配子串左側的文本； $‘：位於匹配子串右側的文本 $$：直接量$符號
布爾類型（Boolean）
布爾類型僅包含真假，與Python不同的是其首字母小寫（true/false）
== 比較值相等
例如：
1==‘1‘true
!= 不等於
例如：
1!=2true
=== 比較值和類型相等
1 === "1"
例如：
false1 === 1true
!=== 不等於
|| 或
&& 且
數組
JavaScript中的數組類似於python的列表
obj.length 數組的大小 obj.push(ele) 尾部追加元素obj.pop() 尾部擷取一個元素obj.unshift(ele) 頭部插入元素obj.shift() 頭部移除元素obj.splice(start, deleteCount, value, ...) 插入、刪除或替換數組的元素 obj.splice(n,0,val) 指定位置插入元素 obj.splice(n,1,val) 指定位置替換元素 obj.splice(n,1) 指定位置刪除元素obj.slice( ) 切片obj.reverse( ) 反轉obj.join(sep) 將數組元素串連起來以構建一個字串obj.concat(val,..) 串連數組obj.sort( ) 對數組元素進行排序
JavaScript定義變數：
全域變數：
name = "abc"
局部變數
var name = "cba"
定義函數：
<script> function function_name(){ statement1; statement2 }</script>
調用函數：
function_name()
樣本：定義並調用函數：
<!DOCTYPE html><html><head><meta charset="utf-8"><title>demp</title></head><body><h1 id="demo">歡迎老男孩</h1></body><script> function func(){ var tag = document.getElementById(‘demo‘);//根據ID擷取標籤 var content =tag.innerText;//擷取標籤中的常值內容（這裡為歡迎老男孩） var f = content.charAt(0); //擷取文本第一個字元 var l = content.substring(1,content.length); //擷取文本第二個字元到最後一個字元 var new_content = l + f; //第二個字元到最後一個字元加上第一個字元（迎老男孩歡） tag.innerText = new_content;//用新的字元替換原來的字元 } setInterval(‘func()‘,1000);</script></html>
setInterval(‘func()‘,interval)是javascript定時器, 表示每間隔interval毫秒，執行一次func()函數
charAt(n)：JavaScript字串的一個方法：擷取指定下標的字元，跟python一樣，下標從0開始
substring(m,n)：JavaScript字串的一個方法，擷取從第m下標到第n下標的字元集
length：JavaScript字串的一個方法，擷取字串長度
JavaScript for迴圈
1、迴圈時，迴圈元素是索引
a=[11,22,33,44]for(var i in a){ console.log(a[i]);}11223344
迴圈字典
a={"name":"zeng","age":28}for(var item in a){ console.log(a[item]); }"zeng"28a={"name":"zeng","age":28}for(var item in a){ console.log(item); }nameage
2、迴圈時，迴圈元素的下標，不支援字典
a=[11,22,33,44]for(var i=0;i<a.length;i=i+1){ console.log(a[i]);}11223344
JavaScript條件判斷
if(條件){
}else if(條件){
}else if(條件){
}else{
}
JavaScript DOM操作：
1、找到標籤
a、直接找標籤
document.getElementById(‘id‘)：通過id擷取單個元素 document.getElementByTagName(‘div‘)：通過tag擷取多個元素 document.getElementByClassName(‘cl‘)：通過class擷取多個元素
b、間接找標籤
parentElement //父節點標籤元素 children //所有字標籤 firstElementChild //第一個子標籤元素 lastElementChild //最後一個子標籤元素 nextElementSibling //下一個兄弟標籤元素 previousElementSibling //上一個兄弟標籤元素
2、操作標籤
擷取標籤中的常值內容
a、
標籤.innerText
對標籤內部文本重新賦值
標籤.innerText=""
<a>asdfa</a><a>8908</a><a>asd234</a>//擷取所有a標籤，儲存到ll列表中，然後用for迴圈修改所有a標籤的常值內容。ll=document.getElementsByTagName(‘a‘)[a, a, a]for(var i=0;i<ll.length;i=i+1){ll[i].innerText=‘666‘}"666"
b、
classname tag.className = "" 直接整體操作 tag.classList.add(“樣式名”) 添加樣式 tag.classList.remove(“樣式名”) 刪除樣式
執行個體：全選、反選、取消
<!DOCTYPE html><html><head><meta charset="utf-8"><title>demp</title></head><body style="margin: 0";><div> <input type="button" value="添加" onclick="ShowModel();"> <input type="button" value="全選" onclick="ChooseAll();"> <input type="button" value="取消" onclick="CancleAll();"> <input type="button" value="反選" onclick="ReverseAll();"> <table> <thead> <tr> <th>選擇</th> <th>主機名稱</th> <th>連接埠</th> </tr> </thead> <tbody id="tb"> <tr> <td><input type="checkbox"></td> <td>host1</td> <td>8080</td> </tr> <tr> <td><input type="checkbox"></td> <td>host2</td> <td>8081</td> </tr> <tr> <td><input type="checkbox"></td> <td>host3</td> <td>8083</td> </tr> </tbody> </table></div></body><script type="text/javascript"> function ChooseAll(){ var tbody = document.getElementById("tb"); var tr_list = tbody.children; for(var i=0;i<tr_list.length;i=i+1){ var current_tr = tr_list[i] var checkbox = current_tr.children[0].children[0]; checkbox.checked = true; } } function CancleAll(){ var tbody = document.getElementById("tb"); var tr_list = tbody.children; for(var i=0;i<tr_list.length;i=i+1){ var current_tr = tr_list[i] var checkbox = current_tr.children[0].children[0]; checkbox.checked = false; } } function ReverseAll(){ var tbody = document.getElementById("tb"); var tr_list = tbody.children; for(var i=0;i<tr_list.length;i=i+1){ var current_tr = tr_list[i] var checkbox = current_tr.children[0].children[0]; if(checkbox.checked) { checkbox.checked = false; } else{ checkbox.checked = true; } } }</script></html>
本文出自 “zengestudy” 部落格，請務必保留此出處http://zengestudy.blog.51cto.com/1702365/1918963
JavaScript基礎之定義函數
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
