六一筆記
1、ajaxjavascript
AJAX的概念就是頁面互動無刷新的效果。
例如:你作一個註冊頁面，由於用戶通常都是惟一的，這個時候你就能夠選擇一個比較人性化的作法，就是使用AJAX技術，當填完信息鼠標移開txtUserName這個文本框的時候 觸發一個事件，而後這個事件調用一個JS方法。JS方法裏面使用xmlHttpRequest這個對象。就能夠異步的調用後來 來完成一個 查詢而且判斷的過程。 最後返回一個結果 在前面來判斷輸入的 「用戶名是否在!」。css
2、表單驗證html
表單驗證是javascript中的高級選項之一。JavaScript 可用來在數據被送往服務器前對 HTML 表單中的這些輸入數據進行驗證。java
被 JavaScript 驗證的這些典型的表單數據有：jquery
用戶是否已填寫表單中的必填項目？程序員
用戶輸入的郵件地址是否合法？web
用戶是否已輸入合法的日期？ajax
用戶是否在數據域(numeric field) 中輸入了文本？shell
必填項目
下面的函數用來檢查用戶是否已填寫表單中的必填（或必選）項目。假如必填或必選項爲空，那麼警告框會彈出，而且函數的返回值爲 false，不然函數的返回值則爲 true（意味着數據沒有問題）：編程
function validate_required(field, alerttxt)
{ with(field)
{ if (value == null || value == "")
{ alertalerttxt); return false; }
else { return true; } } }
function validate_required(field, alerttxt)
{ with(field)
{ if (value == null || value == "")
{ alertalerttxt); return false; }
else { return true; } } }
下面是連同 HTML 表單的代碼：
Email:
郵箱驗證
下面的函數檢查輸入的數據是否符合電子郵件地址的基本語法。
意思就是說，輸入的數據必須包含 @ 符號和點號(.)。同時，@ 不能夠是郵件地址的首字符，而且 @ 以後需有至少一個點號：
function validate_email(field, alerttxt) { with(field) { apos = value.indexOf("@") dotpos = value.lastIndexOf(".") if (apos < 1 || dotpos - apos < 2) { alertalerttxt); return false; } else { return true; } } }
function validate_email(field, alerttxt) { with(field) { apos = value.indexOf("@") dotpos = value.lastIndexOf(".") if (apos < 1 || dotpos - apos < 2) { alertalerttxt); return false; } else { return true; } } }
下面是連同 HTML 表單的完整代碼：
function validate_email(field, alerttxt)
{
with(field) { apos = value.indexOf("@"); dotpos = value.lastIndexOf(".");
if (apos < 1 || dotpos - apos < 2)
{
alertalerttxt);
return false;
}
else
{
return true;
}
}
}
function validate_form(thisform)
{
with(thisform)
{
if (validate_email(email, "Not a valid e-mail address!") == false)
{
email.focus();
return false
}
}
}
Email:
發送數據
3、彈出框大小
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Alert Dialogs</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<meta name="description" content="This is a demonstration page." />
<meta name="keywords" content="alert, confirm, prompt, demo" />
<style type="text/css">
BODY,
HTML {
padding: 0px;
margin: 0px;
}
BODY {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
background: #FFF;
padding: 15px;
}
H1 {
font-size: 20px;
font-weight: normal;
}
H2 {
font-size: 16px;
font-weight: normal;
}
FIELDSET {
border: solid 1px #CCC;
-moz-border-radius: 16px;
-webkit-border-radius: 16px;
border-radius: 16px;
padding: 1em 2em;
margin: 1em 0em;
}
LEGEND {
color: #666;
font-size: 16px;
padding: 0em .5em;
}
PRE {
font-family: "Courier New", monospace;
font-size: 11px;
color: #666;
background: #F8F8F8;
padding: 1em;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
}
/* Custom dialog styles */
#popup_container.style_1 {
font-family: Georgia, serif;
color: #A4C6E2;
background: #005294;
border-color: #113F66;
}
#popup_container.style_1 #popup_title {
color: #FFF;
font-weight: normal;
text-align: left;
background: #76A5CC;
border: solid 1px #005294;
padding-left: 1em;
}
#popup_container.style_1 #popup_content {
background: none;
}
#popup_container.style_1 #popup_message {
padding-left: 0em;
}
#popup_container.style_1 INPUT[type='button'] {
border: outset 2px #76A5CC;
color: #A4C6E2;
background: #3778AE;
}
</style>
<!-- Dependencies -->
<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.ui.draggable.js" type="text/javascript"></script>
<!-- Core files -->
<script src="jquery.alerts.js" type="text/javascript"></script>
<link href="jquery.alerts.css" rel="stylesheet" type="text/css" media="screen" />
<!-- Example script -->
<script type="text/javascript">
$(document).ready( function() {
$("#alert_button").click( function() {
jAlert('This is a custom alert box', 'Alert Dialog');
});
$("#confirm_button").click( function() {
jConfirm('Can you confirm this?', 'Confirmation Dialog', function(r) {
jAlert('Confirmed: ' + r, 'Confirmation Results');
});
});
$("#prompt_button").click( function() {
jPrompt('Type something:', 'Prefilled value', 'Prompt Dialog', function(r) {
if( r ) alert('You entered ' + r);
});
});
$("#alert_button_with_html").click( function() {
jAlert('You can use HTML, such as <strong>bold</strong>, <em>italics</em>, and <u>underline</u>!');
});
$(".alert_style_example").click( function() {
$.alerts.dialogClass = $(this).attr('id'); // set custom style class
jAlert('This is the custom class called “style_1”', 'Custom Styles', function() {
$.alerts.dialogClass = null; // reset to default
});
});
});
</script>
</head>
<body>
<h1><a href="http://abeautifulsite.net/2008/12/jquery-alert-dialogs/">« jQuery Alert Dialogs (Alert, Confirm, & Prompt Replacements)</a></h1>
<h2>Basic Examples</h2>
<fieldset>
<legend>Alert</legend>
<pre>
jAlert('This is a custom alert box', 'Alert Dialog');
</pre>
<p>
<input id="alert_button" type="button" value="Show Alert" />
</p>
</fieldset>
<fieldset>
<legend>Confirm</legend>
<pre>
jConfirm('Can you confirm this?', 'Confirmation Dialog', function(r) {
jAlert('Confirmed: ' + r, 'Confirmation Results');
});
</pre>
<p>
<input id="confirm_button" type="button" value="Show Confirm" />
</p>
</fieldset>
<fieldset>
<legend>Prompt</legend>
<pre>
jPrompt('Type something:', 'Prefilled value', 'Prompt Dialog', function(r) {
if( r ) alert('You entered ' + r);
});
</pre>
<p>
<input id="prompt_button" type="button" value="Show Prompt" />
</p>
</fieldset>
<h2>Additional Examples</h2>
<fieldset>
<legend>With HTML</legend>
<pre>
jAlert('You can use HTML, such as <strong>bold</strong>, <em>italics</em>, and <u>underline</u>!');
</pre>
<p>
<input id="alert_button_with_html" type="button" value="Show Alert" />
</p>
</fieldset>
<fieldset>
<legend>Alternate Styles</legend>
<p>
By changing the value of the <samp>$.alerts.dialogClass</samp> property (and creating
your own CSS class), you can changes the style of your dialogs:
</p>
<p>
<input id="style_1" class="alert_style_example" type="button" value="Style 1" />
</p>
<p>
View the plugin source for additional properties that can be modifed at runtime.
</p>
</fieldset>
<p>
<a href="http://abeautifulsite.net/2008/09/jquery-context-menu-plugin/">Back to the project page</a>
</p>
</body>
</html>
記得導入3個js 和 1個css，能夠經過css改變樣式
4、開發人員控制面板
Elements:查找網頁源代碼HTML中的任一元素,手動修改任一元素的屬性和樣式且能實時在瀏覽器裏面獲得反饋。
Console:記錄開發者開發過程當中的日誌信息，且能夠做爲與JS進行交互的命令行Shell。
Sources:斷點調試JS。
Network:從發起網頁頁面請求Request後分析HTTP請求後獲得的各個請求資源信息（包括狀態、資源類型、大小、所用時間等），能夠根據這個進行網絡性能優化。
Timeline:記錄並分析在網站的生命週期內所發生的各種事件，以此能夠提升網頁的運行時間的性能。
Profiles:若是你須要Timeline所能提供的更多信息時，能夠嘗試一下Profiles,好比記錄JS CPU執行時間細節、顯示JS對象和相關的DOM節點的內存消耗、記錄內存的分配細節。
Application:記錄網站加載的全部資源信息，包括存儲數據（Local Storage、Session Storage、IndexedDB、Web SQL、Cookies）、緩存數據、字體、圖片、腳本、樣式表等。
Security:判斷當前網頁是否安全。
Audits:對當前網頁進行網絡利用狀況、網頁性能方面的診斷，並給出一些優化建議。好比列出全部沒有用到的CSS文件等。注： 這一篇主要講解前三個面板Elements、Console、Sources。
5、onclick用法
window.location.replace(「url」)：將地址替換成新url，該方法經過指定URL替換當前緩存在歷史裏（客戶端）的項目，所以當使用replace方法以後，你不能經過「前進」和「後 退」來訪問已經被替換的URL，這個特色對於作一些過渡頁面很是有用！
window.location.reload()：強制刷新頁面，從服務器從新請求！
window.location.href和window.location.replace的區別：
假設有3個jsp頁面（1.jsp, 2.jsp, 3.jsp），進系統默認的是1.jsp ，當我進入2.jsp的時候， 2.jsp裏面用window.location.replace(「3.jsp」);與用window.location.href(「3.jsp」);從用戶界面來看是沒有什麼區別的，可是當3.jsp頁面有一個「返回」按鈕，調用window.history.go(-1);wondow.history.back();方法的時候，一點這個返回按鈕就要返回2.jsp頁面的話，區別就出來了，當用window.location.replace(「3.jsp」);連到3.jsp頁面的話，3.jsp頁面中的調用window.history.go(-1);wondow.history.back();方法是很差用的，會返回到1.jsp 。當用window.location.href(「3.jsp」)；連到3.jsp頁面的話，3.jsp頁面中的調用window.history.go(-1);wondow.history.back();方法是好用的，會返回2.jsp。由於window.location.replace(「3.jsp」);是不向服務器發送請求的跳轉，而window.history.go(-1);wondow.history.back();方法是根據服務器記錄的請求決定該跳到哪一個頁面的，因此會跳到系統默認頁面1.jsp 。window.location.href(「3.jsp」);是向服務器發送請求的跳轉，window.history.go(-1);wondow.history.back();方法是根據服務器記錄的請求決定該跳到哪一個頁面的，因此就能夠返回到2.jsp。
window.location和window.open區別：
在給按鈕、表格、單元格、下拉列表和DIV等作連接時通常都要用Javascript來完成，和作普通連接同樣，可能須要讓連接頁面在當前窗口打開，也可能須要在新窗口打開，這時就可使用下面兩項之一來完成：
window.open 用來打開新窗口
window.location 用來替換當前頁，也就是從新定位當前頁
能夠用如下來個實例來測試一下。
<input type=」button」 value=」新窗口打開」 onclick=」window.open(‘http://www.zhousl.com/’)」>
<input type=」button」 value=」當前頁打開」 onclick=」window.location=’http://www.zhousl.com/’」>
window.location.Reload()和window.location.href=window.location.href;都是刷新當前頁面。
6、分支循環
一、當有多個條件是用 elif 這樣就不用那麼多縮進
score = int(input('輸入一個分數'))
if 100 >= score >= 85:
print('A')
elif 85 > score >= 60:
print('B')
elif 60 > score >= 0:
print('C')
else:
print('輸入錯誤! ')
二、三元操做符 語法 x if 條件 else y
small = x if x < y else y #當if後面的條件爲真的時候把x的值賦給small；當條件爲假的時候把y的值賦給small
三、斷言 assert #當這個關鍵字後面的條件爲假的時候程序自動崩潰，並拋出AssertError。當須要程序中的某個條件必定爲真時才能讓程序正常運行，assert就很是有用。
>>> assert 3 < 4
>>> assert 3 > 5
Traceback (most recent call last):
File "<pyshell#70>", line 1, in <module>
assert 3 > 5
AssertionError
四、while循環 #在條件爲真的時候執行某一段制定的代碼，只要條件爲真，while循環就會一直去重複執行那一段代碼。這段代碼就是一個循環體。
五、for循環
①>>> favourite = 'welcom' ②>>>member = ['QQ', 'QW', 'QR']
>>> for i in favourite: >>>for each in member:
print(i, end='8') print(eacd, len(each)) #打印each的長度 即QQ有兩個字符就打印2
w8e8l8c8o8m8 QQ 2
QW 2
QR 2
六、range語法：range(start, stop, step) 默認step=1
① >>> range(0,5)
>>> list(range(5))
[0, 1, 2, 3, 4]
② >>> for i in range(2, 7): #7是不包含的
print(i)
2
3
4
5
6
③>>> for i in range(1, 10, 4): #4表明每次步進4，從1開始打印出1-10從1開始每次步進4的數
print(i)
1
5
9
七、break 終止當前循環並跳出這個循環體
bingo = '猜答案'
print('輸入一句話')
answer = raw_input()
#print bingo
#print answer
while True:
if answer == bingo:
break
print('抱歉輸錯了,請從新輸入才能退出')
answer = raw_input()
print('很好額')
print('答對了')
八、continue 當循環條件爲True的時候終止本輪循環並開始下一輪循環 ，若是不退的話會跳出循環
for i in range(10):
if i%2 != 0:
print(i)
continue
i += 2
print(i)
顯示結果是：
2
1
4
3
6
5
8
7
10
9
window.location.Reload()若是有數據提交的話，會提示是否提交的(是和否選項)
window.location.href=window.location.href是定向url提交數據
最好不要用location.re
load()，而用location=location比較好，還有在模式窗口（showModalDialog和showModelessDialog）前者不能用。
reload() 方法用於從新加載當前文檔。
語法
location.reload(force)說明
若是該方法沒有規定參數，或者參數是 false，它就會用 HTTP 頭 If-Modified-Since 來檢測服務器上的文檔是否已改變。若是文檔已改變，reload() 會再次下載該文檔。若是文檔未改變，則該方法將從緩存中裝載文檔。這與用戶單擊瀏覽器的刷新按鈕的效果是徹底同樣的。
若是把該方法的參數設置爲 true，那麼不管文檔的最後修改日期是什麼，它都會繞過緩存，從服務器上從新下載該文檔。這與用戶在單擊瀏覽器的刷新按鈕時按住 Shift 健的效果是徹底同樣。
好象是說:
若是window.loacation.reload(true)==window.location.href=」xxx.xx」;
This entry was posted in js and tagged JQ函數, Js函數. Bookmark the permalink
7、強數據類型
強類型定義語言
一種老是強制類型定義的語言。Java和Python是強制類型定義的。若是你有一個整數，若是不顯示地進行轉換，你不能將其視爲一個字符串來用
弱類型定義語言
一種類型能夠被忽略的語言，與強類型定義相反。VBScript是弱類型定義的。在VBScript中，能夠將字符串 '12' 和整數 3 進行鏈接獲得字符串 '123'，而後能夠把它當作整數 123，而不須要顯示轉換 。
8、垃圾回收機制
要理解什麼是垃圾回收機制，首先要對內存管理概念有一個基本的認識。內存管理是指操做系統如何進行內存的分配和回收的機制。早期的計算機語言，好比C, 它經過malloc, free函數來向操做系統請求
內存和釋放內存。 這種機制的優勢是內存分配和釋放的效率很高。可是它也有着它的缺點，主要表如今對於複雜的系統，存在着大量的內存分配和釋放操做。程序員很容易不當心忘記釋放內存，從而形成內
存的泄露，對於長期運行的軟件來說，這將是一個致命的威脅，由於系統的內存會逐漸被吃光。 所以，更新的編程語言，好比JAVA, C#, 都提供了所謂「垃圾回收的機制」，運行時自身會運行相應的垃圾
回收機制。程序員只須要申請內存，而不須要關注內存的釋放。垃圾回收器(GC)會在適當的時候將已經終止生命週期的變量的內存給釋放掉。
GC的優勢就在於它大大簡化了應用層開發的複雜度，下降了內存泄露的風險
9、閉包
閉包是指能夠包含自由（未綁定到特定對象）變量的代碼塊；這些變量不是在這個代碼塊內或者任何全局上下文中定義的，而是在定義代碼塊的環境中定義（局部變量）。「閉包」 一詞來源於如下二者的
結合：要執行的代碼塊（因爲自由變量被包含在代碼塊中，這些自由變量以及它們引用的對象沒有被釋放）和爲自由變量提供綁定的計算環境（做用域）。在PHP、Scala、Scheme、Common Lisp、
Smalltalk、Groovy、JavaScript、Ruby、 Python、Go、Lua、objective c、swift 以及Java（Java8及以上）等語言中都能找到對閉包不一樣程度的支持。
本質
度量空間中的
極限點
性質
舉例說明
語法結構
環境表達
代碼
|
1
2
3
4
5
6
7
8
9
|
function
a(){
var
i=0;
function
b(){
alert(++i);
}
return
b;
}
var
c=a();
c();
|
特色
做用
另外一個例子
return{
increment:function(){
count++;
},
get:function(){
return count;
}
}
}
var foo =Counter(4);
foo.increment();
foo.get();// 5
結果
- 1. 筆試筆記（六）
- 2. FPGA 筆記六
- 3. 筆記六 - gen_event
- 4. 筆記六(11.6)
- 5. Nginx---筆記六
- 6. ECMAScript 6 筆記（六）
- 7. 春招筆記（六）
- 8. 學習筆記（六）
- 9. 讀書筆記(六)
- 10. 實習筆記 六
- 更多相關文章...
- • ASP.NET Razor - 標記 - ASP.NET 教程
- • ADO 添加記錄 - ADO 教程
- • Tomcat學習筆記（史上最全tomcat學習筆記）
- • RxJava操作符（六）Utility
-
每一个你不满意的现在，都有一个你没有努力的曾经。
- 1. No provider available from registry 127.0.0.1:2181 for service com.ddbuy.ser 解決方法
- 2. Qt5.7以上調用虛擬鍵盤(支持中文)，以及源碼修改(可拖動，水平縮放)
- 3. 軟件測試面試- 購物車功能測試用例設計
- 4. ElasticSearch（概念篇）：你知道的, 爲了搜索…
- 5. redux理解
- 6. gitee創建第一個項目
- 7. 支持向量機之硬間隔（一步步推導，通俗易懂）
- 8. Mysql 異步複製延遲的原因及解決方案
- 9. 如何在運行SEPM配置嚮導時將不可認的複雜數據庫密碼改爲簡單密碼
- 10. windows系統下tftp服務器使用
- 1. 筆試筆記（六）
- 2. FPGA 筆記六
- 3. 筆記六 - gen_event
- 4. 筆記六(11.6)
- 5. Nginx---筆記六
- 6. ECMAScript 6 筆記（六）
- 7. 春招筆記（六）
- 8. 學習筆記（六）
- 9. 讀書筆記(六)
- 10. 實習筆記 六