近幾年工作經驗中總結的JavaScript使用技巧

ljyt6re6UY 7年前發布 | 29K 次閱讀 JavaScript開發 JavaScript

本文作者分享了作者近幾年工作中的經驗總結的 js 使用技巧,1.ajax接收JSON,需要用eval轉化為字符串,2.ajax發出兩個請求,使用同步解決問題,數組合并等

1、如果 ajax 返回單一的 json 格式,接收方需要這樣再格式化一下賦值:

var str = eval("(" + msg + ")");

開發引用: /// <reference path="http://x.autoimg.cn/as/static/js/jquery-1.7.2.min.js" />

2、如果 ajax 同發出兩個以上的請求時,返回的狀態會串,不能用異步,用同步可以解決問題;

3、navigator.plugins[“Shockwave Flash”] 檢查 當前機器 flash 版本

4、刪除前后空格 String.prototype.trim = function () { return this.replace(/(^[ | ] )|([ | ] $)/g, “”); }

5、IE6 下 JS 在執行一個方法后,當前方法內的代碼執行完后,此次的單線程就會停止,當前的方法里還有其它的方法也不會再執行;如果要執行的話,需要加 setTimeout(); 事件再執行;

6、把 document.getElementById(id) 轉換成 ( “ i ” ) u n c t i o n

(id) { return typeof (id) == ‘string’ ? document.getElementById(id) : id }

7、圖片加載失敗,并防止死循環 onerror=”this.src=aaa.jpg;this.onerror=null;”

8、document.getElementsByTagName(‘*’).length 查看頁面有多少個 Dom 元素;

9、parseInt() 只會返回整數部分;一個完整的parseInt應該是這樣的:parseInt(string, radix),其中radix指定數字的進制(十進制,二進制,十六進制etc.) parseInt(“f”,16): 15

把加號放在包含合法數字的字符串前面會將字符串轉化為數字;

Null 用成數字時會表現為0,做布爾時表現為false.

聲明一個變量但沒有賦值,此時這個變量的值為undefined. Undefined用作數字時類型表現為NaN, 用作布爾時表現為false.

10、各種正則驗證規則 數字驗證規則:

"^\\d+$"        //非負整數(正整數 + 0)
"^[0-9]*[1-9][0-9]*$"        //正整數
"^((-\\d+)|(0+))$"        //非正整數(負整數 + 0)
"^-[0-9]*[1-9][0-9]*$"        //負整數
"^-?\\d+$"                //整數
"^\\d+("        //非負浮點數(正浮點數 + 0)
"^(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*))$"        //正浮點數
"^((-\\d+("        //非正浮點數(負浮點數 + 0)
"^(-(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*)))$"        //負浮點數
"^(-?\\d+)("        //浮點數
var r = /^\+?[1-9][0-9]*$/;        //正整數
r.test(str);

11、按照 json 的屬性值排序

var cc=[
{ name: "a", age: 30},
{ name: "c", age: 24},
{ name: "b", age: 28},
{ name: "e", age: 18},
{ name: "d", age: 38}
].sort(function(obj1, obj2) {
return obj1.age - obj2.age;
});
for(var i=0;i<cc.length;i++){
alert(cc[i]['age']); //依次顯示 18,24,28,30,38
}

12、合并數組:

var mergeTo = [4,5,6];
var mergeFrom = [7,8,9];
Array.prototype.push.apply(mergeTo, mergeFrom);
mergeTo; // is: [4, 5, 6, 7, 8, 9]

13、多點擊事件獲取點擊的是哪個

$('#IndexLink,#IndexLink1').on('click', function (e) {
var id=e.target.id;
//id 取到的就是被點擊的ID值
}

14、zepto 里面或者 jquery 里返回 ajax json 串時,如果你的 json 串不規范(里面的鍵名,值,必須是雙引號),就會跳出 success 方法,而且不執行里面的所有語句;

15、再JavaScript中下面做法會聲明全局變量
在function外使用聲明變量(無論是否使用var) ;
在function內不是用var 聲明變量 ;
直接賦值于window屬性;

16、錨點定位方法

window.location.hash = 'm001';
<a name="m001"> </a>
17、window.history.forward(1); 阻止頁面后退;

18、 JS call 與aplly 用法

function Person(name, age) {
this.name = name;
this.age = age;
};

function Student(name, age, grade) {
Person.apply(this, arguments);
this.grade = grade;
};
var student = new Student('qian', 21, '一年級');
alert('name:' + student.name + '\n' + 'age:' + student.age + '\n' + 'grade:' + student.grade);

//也就是通俗一點講就是:用student去執行Person這個類里面的內容,在Person這個類里面存在this.name等之類的語句,
//這樣就將屬性創建到了student對象里面

18)頁面到底部自動加載內容:

var divH = document.body.scrollHeight,top = document.body.scrollTop,windowH = window.screen.availHeight;
if ((top + windowH) >divH) {
console.log('該他媽的加載內容了。');
}
console.log('網頁正文全文高:' + document.body.scrollHeight + ' 網頁被卷去的高: ' + document.body.scrollTop + ' 屏幕可用工作區高度:' + window.screen.availHeight);

 

來自:http://geek.csdn.net/news/detail/201053

 

 本文由用戶 ljyt6re6UY 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!