HTML沒有計算能力。

iframe的優(yōu)缺點?優(yōu)點:

1. 解決加載緩慢的第三方內(nèi)容如圖標和廣告等的加載問題

2. Security sandbox

3. 并行加載腳本

缺點:

1. iframe會阻塞" />

国产成人精品无码青草_亚洲国产美女精品久久久久∴_欧美人与鲁交大毛片免费_国产果冻豆传媒麻婆精东

18143453325 在線咨詢 在線咨詢
18143453325 在線咨詢
所在位置: 首頁 > 營銷資訊 > 建站知識 > 前端開發(fā) ? 見解

前端開發(fā) ? 見解

時間:2023-02-20 17:28:01 | 來源:建站知識

時間:2023-02-20 17:28:01 來源:建站知識

前端開發(fā) ? 見解:為什么要引用JavaScript語言呢?

HTML沒有計算能力。

iframe的優(yōu)缺點?

優(yōu)點:

1. 解決加載緩慢的第三方內(nèi)容如圖標和廣告等的加載問題

2. Security sandbox

3. 并行加載腳本

缺點:

1. iframe會阻塞主頁面的Onload事件

2. 即時內(nèi)容為空,加載也需要時間

3. 沒有語意

Ajax 是什么? 如何創(chuàng)建一個Ajax?

Ajax并不算是一種新的技術(shù),全稱是asynchronous javascript and xml,可以說是已有技術(shù)的組合,主要用來實現(xiàn)客戶端與服務(wù)器端的異步通信效果,實現(xiàn)頁面的局部刷新,早期的瀏覽器并不能原生支持ajax,可以使用隱藏幀(iframe)方式變相實現(xiàn)異步效果,后來的瀏覽器提供了對ajax的原生支持

使用ajax原生方式發(fā)送請求主要通過XMLHttpRequest(標準瀏覽器)、ActiveXObject(IE瀏覽器)對象實現(xiàn)異步通信效果

基本步驟:

varxhr =null;//創(chuàng)建對象

if(window.XMLHttpRequest){

xhr = new XMLHttpRequest();

}else{

xhr = newActiveXObject("Microsoft.XMLHTTP");

}

xhr.open(“方式”,”地址”,”標志位”);//初始化請求

xhr.setRequestHeader(“”,””);//設(shè)置http頭信息

xhr.onreadystatechange =function(){}//指定回調(diào)函數(shù)

xhr.send();//發(fā)送請求

js框架(jQuery/EXTJS等)提供的ajax API對原生的ajax進行了封裝,熟悉了基礎(chǔ)理論,再學(xué)習(xí)別的框架就會得心應(yīng)手,好多都是換湯不換藥的內(nèi)容

一起分享有用的干貨。

重點是理解DOM操作。

數(shù)據(jù)類型
面向?qū)ο?br>繼承
閉包
插件
作用域
跨域
原型鏈
模塊化
自定義事件
內(nèi)存泄漏
事件機制
異步裝載回調(diào)
模板引擎
JSON
ajax(這個我喜歡用jQuery的。不然要寫好多兼容。)

js事件觸發(fā)理解:

onkeypress 在用戶按下并放開任何字母數(shù)字鍵時發(fā)生。系統(tǒng)按鈕(例如,箭頭鍵和功能鍵)無法得到識別。[響應(yīng)一個鍵]onkeyup 在用戶放開任何先前按下的鍵盤鍵時發(fā)生。onkeydown 在用戶按下任何鍵盤鍵(包括系統(tǒng)按鈕,如箭頭鍵和功能鍵)時發(fā)生。[響應(yīng)幾個鍵的組合]可以響應(yīng)Ctrl、Alt、Shift等功能鍵和鍵的組合,而onkeypress不能onfocusout 失去光標事件onfocus 獲得光標事件onabort 圖片下載被打斷時onblur 元素失去焦點時onclick 鼠標點擊ondblclick 鼠標雙擊onerror 加載文檔或圖片發(fā)生錯誤時onmousedown 鼠標被按下時onmousemove 鼠標被移動時onmouseout 鼠標離開元素時onmouseover 鼠標經(jīng)過元素時onmouseup 釋放鼠標按鍵時onunload 用戶離開頁面時

入手js功能,把平時網(wǎng)站上常用的一些實用功能代碼片段通:

100個直接可以拿來用的JavaScript實用功能代碼片段

這上面有很多實用的例子,可以看下是怎么實現(xiàn)的,然后學(xué)習(xí)理解他所用的知識點。

這里提取一些我常用到的片段:

原生JavaScript實現(xiàn)字符串長度截取

function cutstr(str, len) { var temp; var icount = 0; var patrn = /[^/x00-/xff]/; var strre = ""; for (var i = 0; i < str.length; i++) { if (icount < len - 1) { temp = str.substr(i, 1); if (patrn.exec(temp) == null) { icount = icount + 1 } else { icount = icount + 2 } strre += temp } else { break } } return strre + "..." }
原生JavaScript獲取域名主機

function getHost(url) { var host = "null"; if(typeof url == "undefined"|| null == url) { url = window.location.href; } var regex = /^/w+/:////([^//]*).*/; var match = url.match(regex); if(typeof match != "undefined" && null != match) { host = match[1]; } return host;}
原生JavaScript元素顯示的通用方法

function $(id) { return !id ? null : document.getElementById(id); } function display(id) { var obj = $(id); if(obj.style.visibility) { obj.style.visibility = obj.style.visibility == 'visible' ? 'hidden' : 'visible'; } else { obj.style.display = obj.style.display == '' ? 'none' : ''; } }
原生JavaScript實現(xiàn)checkbox全選與全不選

function checkAll() { var selectall = document.getElementById("selectall"); var allbox = document.getElementsByName("allbox"); if (selectall.checked) { for (var i = 0; i < allbox.length; i++) { allbox[i].checked = true; } } else { for (var i = 0; i < allbox.length; i++) { allbox[i].checked = false; } }}
原生JavaScript完美判斷是否為網(wǎng)址

function IsURL(strUrl) { var regular = /^/b(((https?|ftp):////)?[-a-z0-9]+(/.[-a-z0-9]+)*/.(?:com|edu|gov|int|mil|net|org|biz|info|name|museum|asia|coop|aero|[a-z][a-z]|((25[0-5])|(2[0-4]/d)|(1/d/d)|([1-9]/d)|/d))/b(//[-a-z0-9_:/@&?=+,.!//~%/$]*)?)$/i if (regular.test(strUrl)) { return true; } else { return false; }}
原生JavaScript獲得URL中GET參數(shù)值

// 用法:如果地址是 test.htm?t1=1&t2=2&t3=3, 那么能取得:GET["t1"], GET["t2"], GET["t3"]function get_get(){ querystr = window.location.href.split("?") if(querystr[1]){ GETs = querystr[1].split("&") GET =new Array() for(i=0;i<GETs.length;i++){ tmp_arr = GETs[i].split("=") key=tmp_arr[0] GET[key] = tmp_arr[1] } } return querystr[1];}
原生JavaScript跨瀏覽器添加事件

function addEvt(oTarget,sEvtType,fnHandle){ if(!oTarget){return;} if(oTarget.addEventListener){ oTarget.addEventListener(sEvtType,fnHandle,false); }else if(oTarget.attachEvent){ oTarget.attachEvent("on" + sEvtType,fnHandle); }else{ oTarget["on" + sEvtType] = fnHandle; }}
原生JavaScript常用的正則表達式

//正整數(shù)/^[0-9]*[1-9][0-9]*$/;//負整數(shù)/^-[0-9]*[1-9][0-9]*$/;//正浮點數(shù)/^(([0-9]+/.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*/.[0-9]+)|([0-9]*[1-9][0-9]*))$/; //負浮點數(shù)/^(-(([0-9]+/.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*/.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; //浮點數(shù)/^(-?/d+)(/./d+)?$/;//email地址/^[/w-]+(/.[/w-]+)*@[/w-]+(/.[/w-]+)+$/;//url地址/^[a-zA-z]+://(/w+(-/w+)*)(/.(/w+(-/w+)*))*(/?/S*)?$/;//年/月/日(年-月-日、年.月.日)/^(19|20)/d/d[- /.](0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])$/;//匹配中文字符/[/u4e00-/u9fa5]/;//匹配帳號是否合法(字母開頭,允許5-10字節(jié),允許字母數(shù)字下劃線)/^[a-zA-Z][a-zA-Z0-9_]{4,9}$/;//匹配空白行的正則表達式//n/s*/r/;//匹配中國郵政編碼/[1-9]/d{5}(?!/d)/;//匹配身份證//d{15}|/d{18}/;//匹配國內(nèi)電話號碼/(/d{3}-|/d{4}-)?(/d{8}|/d{7})?/;//匹配IP地址/((2[0-4]/d|25[0-5]|[01]?/d/d?)/.){3}(2[0-4]/d|25[0-5]|[01]?/d/d?)/;//匹配首尾空白字符的正則表達式/^/s*|/s*$/;//匹配HTML標記的正則表達式< (/S*?)[^>]*>.*?|< .*? />;
原生JavaScript實現(xiàn)返回頂部的通用方法

function backTop(btnId) { var btn = document.getElementById(btnId); var d = document.documentElement; var b = document.body; window.onscroll = set; btn.style.display = "none"; btn.onclick = function() { btn.style.display = "none"; window.onscroll = null; this.timer = setInterval(function() { d.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1); b.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1); if ((d.scrollTop + b.scrollTop) == 0) clearInterval(btn.timer, window.onscroll = set); }, 10); }; function set() { btn.style.display = (d.scrollTop + b.scrollTop > 100) ? 'block': "none" }};backTop('goTop');
原生JavaScript實現(xiàn)全選通用方法

function checkall(form, prefix, checkall) { var checkall = checkall ? checkall : 'chkall'; for(var i = 0; i < form.elements.length; i++) { var e = form.elements[i]; if(e.type=="checkbox"){ e.checked = form.elements[checkall].checked; } }}
原生JavaScript實現(xiàn)全部取消選擇通用方法

function uncheckAll(form) { for (var i=0;i<form.elements.length;i++){ var e = form.elements[i]; if (e.name != 'chkall') e.checked=!e.checked; }}
原生JavaScript獲取單選按鈕的值

function get_radio_value(field){ if(field&&field.length){ for(var i=0;i<field.length;i++){ if(field[i].checked){ return field[i].value; } } }else { return ; } }
原生JavaScript獲取復(fù)選框的值

function get_checkbox_value(field){ if(field&&field.length){ for(var i=0;i<field.length;i++){ if(field[i].checked && !field[i].disabled){ return field[i].value; } } }else { return; } }
原生JavaScript判斷變量是否空值

/** * 判斷變量是否空值 * undefined, null, '', false, 0, [], {} 均返回true,否則返回false */function empty(v){ switch (typeof v){ case 'undefined' : return true; case 'string' : if(trim(v).length == 0) return true; break; case 'boolean' : if(!v) return true; break; case 'number' : if(0 === v) return true; break; case 'object' : if(null === v) return true; if(undefined !== v.length && v.length==0) return true; for(var k in v){return false;} return true; break; } return false;}
能否解答下:

移動端常用類庫及優(yōu)缺點??????????

關(guān)鍵詞:

74
73
25
news

版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。

為了最佳展示效果,本站不支持IE9及以下版本的瀏覽器,建議您使用谷歌Chrome瀏覽器。 點擊下載Chrome瀏覽器
關(guān)閉