ajax與html5
⑴ 當使用ajax技術時,哪一個html5特性能夠提高用戶使用"後退"和"前進"功能的體驗
History 對象從 HTML4 開始引入,HTML5 中增加了 pushState, replaceState 兩個方法,和 popstate 事件。下面作一些簡單的介紹。
1. pushState()方法
pushState() 的作用是往歷史記錄的堆棧中壓入一條記錄,該方法有三個參數:
state object —— 一個對象,用於保存狀態信息,當 popstate 事件被觸發時,popstate 事件對象的 state 屬性會包含相應的 state object 的拷貝。state object 的容量很小(Firefox 中強制為 640k),如果需要儲存較大的數據,建議使用 localStorage 或 sessionStorage。
title —— 即被壓入的歷史記錄的頁面的標題,該屬性暫時被所有瀏覽器忽略,實際開發時可以填空字元或一個簡短的標題。
url —— 新的歷史記錄的地址,可以是相對路徑或絕對路徑,若為相對路徑則以當前 url 為基址。
2. replaceState()方法
replaceState() 方法與 pushState() 方法類似,參數與 pushState() 也相同,但 replaceState() 方法會修改當前的歷史記錄而並非創建新的記錄,因此在需要更新當前歷史記錄的 state object 或 URL 時,使用該方法會更加合適。
3. popstate 事件
popstate 事件會在激活的歷史記錄發生變化(如前進、後退、調用 pushState 或 replaceState 方法)時觸發在 window 對象上。如上面所描述,如果被激活的歷史記錄由 pushState 創建或是被 replaceState 修改,則 popstate 事件的狀態屬性將包含相應的 state object 的拷貝,開發者可以在 popstate 的回調中調用這些之前保存在 state object 中的信息。
值得注意的是,Chrome 會在打開頁面(包括第一次打開頁面)以及頁面刷新時產生 popstate 事件而 Firefox 則不會,這會為開發帶來一些麻煩,但下面會給出解決方案。
⑵ 如何用html5自帶驗證 但是用ajax提交
1.輸入型控制項
Input type
用途
說明
email
電子郵件地址文本框
url
網頁URL文本框
number
數值的輸入域
屬性 值 描述
max number 規定允許的最大值
min number 規定允許的最小值
step number 規定合法的數字間隔(如果 step="3",則合法的數是 -3,0,3,6 等)
value number 規定默認值
range
特定值的范圍的數值,以滑動條顯示
屬性 值 描述
max number 規定允許的最大值
min number 規定允許的最小值
step number 規定合法的數字間隔(如果 step="3",則合法的數是 -3,0,3,6 等)
value number 規定默認值
Date pickers
日期,時間選擇器
僅Opera9+支持,包含date, month, week, time, datetime, datetime-local
search
用於搜索引擎,比如在站點頂部顯示的搜索框
與普通文本框用法一樣,只不過這樣更語文化
color
顏色選擇器
僅Opera支持
將原本type為text的input控制項聲明為以上特殊類型,是為了給用戶呈現不同的輸入界面(移動平台上支持這些不同的輸入界面,這里就不細說),而且表單提交時會對其值做進一步的驗證。下面展示這些新表單元素,請用支持這些表單元素的瀏覽器查看,IE對其支持最差。
E-mail:
date:
range: number: color:
2. 表單新特性和函數
2.1 placeholder
當用戶還沒有輸入值時,輸入型控制項可能通過placeholder向用戶顯示描述性說明文字或者提示信息,這在目前網站中很常見,一些JS框架都會提供類似功能,簡單的說下在舊版本中常用的解決方案,為輸入控制項創建一個label,然後通過CSS控制些label的位置使之覆蓋在輸入控制項上面,當label獲得焦點時,瀏覽器會把焦點指向輸入控制項。不過有了placeholder,新的瀏覽器就內置了這一功能,其特性值會以淺灰色樣式顯示在輸入框中,當輸入框獲得焦點並有值後,該提示信息自動消失。
如:
<p><label for="runnername">Runner:</label>
<input id="runnername"name="runnername" type="text" placeholder="First and last name" />
</p>
Runner:
⑶ 《HTML5和JavaScript教程,jQuery,以及ajax》
可以上w3school網站,裡面有很多資料
⑷ 前端是先學習html5 還是學習ajax
當然是先學習html 這個是網頁的最基礎知識,而ajax只是一種網頁的設計思想,更利於網頁與用戶的交流互動,當你學了H5還有JavaScript這些前端的知識,再來看ajax更容易理解了。然後也同時能很好地將ajax這種方法和思維融入到你的網頁設計中
⑸ HTML5相對於以前的web技術AJAX,最大的改變或不同是什麼
web前端開發:主要是通過html/css,js,ajax,DOM等前端技術,實現網站在客服端的正確顯示及交互功能。可分為:網頁重構,js功能開發。隨著HTML5的到來,RIA時代正在開啟,web前端的應用功能將會更加靈活。最大的好處就是可實現客服端的更加友好的用戶體驗而不會對伺服器帶來過重的負擔。
而web開發,個人覺得未免說得太寬范了點,一般主要指後台的程序開發方面,會用到PHP或ASP,mysql或mssql,ajax等,主要是伺服器端的腳本語言及資料庫技術,這也是網站保證正常動作,技術方面最核心的部分。
⑹ html 中能夠使用ajax嗎
可以使用的。
ajax的基本用法:ajax能做到無刷新數據交互,給用戶體驗帶來好處的同時也減小了伺服器的壓力,所以運用ajax能使網站性能更強勁、更吸引用戶。
第一步:ajax引擎對象的創建(相對簡單的創建方法,更嚴格的方式請參考W3C):
第二步:創建請求機制:(建立與伺服器端的通信介面)
第三步:處理返回的數據(當 readyState 等於 4 且狀態為 200 時,表示響應已就緒,可以在前端進行數據處理了。)
⑺ 在html5前端開發中ajax在項目中重要不
你好 AJAX還是比較重要的,因為用AJAX可以實現不刷新網頁的情況下和後端進行數據傳輸,例如評論或文章的點贊功能就需要用AJAX傳到後台,還有注冊用戶名的時候可以在用戶名輸入完成的時候把用戶名傳到後台驗證是否存在,除了我說的這兩個地方外還有很多地方會用到AJAX,所以還是有必要學一下AJAX的,而且AJAX也不難,如果只是學會使用的話,不用1小時就可以學會使用了,當然 如果要弄懂原理和數據處理的話還是需要下點功夫才行,如果用jQuery的話AJAX會更簡單一些。希望我的回答能夠幫助到你,如果還有什麼疑問可以繼續追問。
⑻ html5和js是什麼關系
JavaScript 是世界上最流行的編程語言。
這門語言可用於 HTML 和 web,更可廣泛用於伺服器、PC、筆記本電腦、平板電腦和智能手機等設備。
JQuery是繼prototype之後又一個優秀的Javascript庫。它是輕量級的js庫 ,它兼容CSS3,還兼容各種瀏覽器(IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+),jQuery2.0及後續版本將不再支持IE6/7/8瀏覽器。jQuery使用戶能更方便地處理HTML(標准通用標記語言下的一個應用)、events、實現動畫效果,並且方便地為網站提供AJAX交互。
CSS即層疊樣式表(Cascading StyleSheet)。 在網頁製作時採用層疊樣式表技術,可以有效地對頁面的布局、字體、顏色、背景和其它效果實現更加精確的控制。
HTML超文本標記語言,標准通用標記語言下的一個應用。
「超文本」就是指頁面內可以包含圖片、鏈接,甚至音樂、程序等非文字元素。
超文本標記語言的結構包括「頭」部分(英語:Head)、和「主體」部分(英語:Body),其中「頭」部提供關於網頁的信息,「主體」部分提供網頁的具體內容。
HTML5萬維網的核心語言、標准通用標記語言下的一個應用超文本標記語言(HTML)的第五次重大修改
⑼ ajax請求報這個錯是怎麼回事,頁面是html5頁面
很顯然js文件你用的不是網路地址而是文件地址,ajax不支持
⑽ 在html5中,多線程worker和非同步ajax有什麼區別
多線程是屬於並發范疇,而非同步是數據請求方式的范疇,與同步相對。從具體使用場景來說,耗CPU的任務可以移到worker中處理,ajax主要是IO費時間,為了保證不讓代碼阻塞,所以非同步處理,等數據到達時再通知程序。這是在html5中的變通方法,因為ajax是比較早實現的,而worker是比較新的一個概念,可以說worker的功能是覆蓋ajax的,只是由於HTML的不斷發展自然出現了這樣的問題。
在其它語言中,一般費時任務都放在其它線程中,以避免阻塞主線程。而不管它是費CPU還是費IO。
總之,這都是HTML的錯。你大可以把網路請求也放在worker中處理,但不幸的是,支持worker的瀏覽器並不多。