JavaScript知識點小記
阿新 • • 發佈：2017-11-02
sid put ask 之一 del notes demo 註冊 iscs
//自定義一個新屬性 //‘<li data-id="‘ + val.id + ‘>‘+ datas[i].name +‘</li>‘ var channel_id = $(this).data(‘id‘);//獲取屬性的值
//截取當前頁面鏈接中的值 var params = document.referrer; //params:?id,date var id = params.substring(40);
js中基本函數的分類
//普通函數
function func(arg){
return true;
}
// 匿名函數
var func=function(arg){
return true;
}
//自執行函數，定義一個函數自己執行自己
f1(arg){
alert(arg);
}
f1
非空判斷
//原生
html: <div class="submit" onclick="submitInfo">提交</div> <script> function submitInfo(){ var info=document.getElementsByClassName(‘submit‘).value; if(info){ //(！！！) return false; }else{ return true; } }</script>
//jquery
<script>
$(.submit).click(function(){
var info = $(.submit).val();
if(info == ""){ //(！！！)
return false;
}else{
return true;
}
}
</script>
根據css樣式判斷要執行的方法
$(".find_nav_list").find(‘li‘).click(function(){
//判斷是否有樣式
$("#id").hasClass("className") ? console.log("Has this class.") : console.log("Do not has this class.");
//切換class類
jquery.toggleClass()//檢查每個元素指定的類，如果沒有則添加，有的話刪除
如何判斷標簽裏是否有css屬性值
把css寫成行內樣式<a style="float:left;">的</a>，這樣可以獲取style的值再判斷是否有margin;
$(".acont a").each(function(){
var ofright = $(this).attr("style").indexOf("margin"); //（！！！）
if(ofright != (-1)){alert("已定義");}
else{$(this).css({"float":"left","font-size":"12px","margin":"10px"});}
});
window.location 詳解
//屬性： hash //從井號 (#) 開始的 URL（錨） host //主機名和當前 URL 的端口號 hostname //當前 URL 的主機名 href //完整的 URL pathname //當前 URL 的路徑部分 port //當前 URL 的端口號 protocol //當前 URL 的協議 search //從問號 (?) 開始的 URL（查詢部分）
//跳轉到指定頁面
window.location.href=‘denglu.html‘;
window.location.reload(‘11.html‘)
//返回上一頁
<a href="Javascript:history.go()"></a>
<a href="Javascript:history.back()"></a>
//這兩者的區別：
history.go(-1):返回上一頁，原頁面表單裏的內容會丟失。back()反之亦然，原頁面表單內容會保留。
//js刷新頁面
location.reload();
//重載頁面，本地刷新
<a href="javascript:location.reload()">重載頁面，本地刷新</a>
總結http://www.jb51.net/article/32749.htm
http://www.qdfuns.com/notes/18224/ce8d9da1f4565cbbaaf694a97b70d2d5.html
js的函數綁定事件
//bind綁定事件
$(".webuploader_pick").bind("click", function(e){ $("#fileImage").click(); });//綁定的點擊事件
enter鍵添加登錄功能
<body onkeydown="keyLogin();"> //(！！！) function keyLogin(){ if(event.keyCode == 13) { //(！！！）13默認enter鍵 $(‘.submit‘).click(); } } </body>
js功能沒有響應的幾種原因
1、js相關文件沒有引入。 2、js文件上下放置順序有問題。
調試js具體步驟
1、查看程序中變量的值。
2、定位錯誤。
字符串拼接問題
1、轉義字符\"後面的冒號最好和外圍的大括號的單雙冒號不一致。
清空表單內容
$(".bs_it").attr(‘value‘, ‘‘);
根據元素裏是否有內容做判斷
if($(".my_collect").html() != ""){ //（！！！） $(‘.collect_msg‘).hide(); }
js屬性操作
html 代碼如下 <a class="main" href="#"></a> var a = document.getElementByClassName(‘main‘); a.href="a.html" //（！！！）屬性操作
return詳述：
if或for之後 return跳出方法
模擬if判斷事件
.html(<div class="fl li02">‘ + (type == 1 ? "公開" : "指定") + ‘</div>);
遇到那種遍歷或者寫同一個事件的功能，如果事件重合或者後面的事件復寫上去，解決辦法之一：給他們區分不同的類名或者id標示。
頁面刷新進去的方法
<body class="body" onload="openwin()">
function openwin()
{
alert(‘網絡錯誤，請重試！‘)
}
同意條款通過後才能執行下面的方法的具體實施辦法
if($(".input_check").is(":checked")){ //(！！！)已選擇
$.fn.request(url,data,function(data){
if(data.success === true){
alert(‘註冊成功‘);
location.href = ‘denglu.html‘;
}else{
alert(data.msg);
}
});
}else{
alert("您還沒有同意條款");
}
js參數傳值問題
function ordersub(oId){
var ordId = oId; //(！！！)聲明之後再用
}
ordersub(info.id);
圖片點擊放大縮小
<style>
.max{width:100%;height:auto;}
.min{width:100px;height:auto;}
</style>
<script>
$(function(){
$(‘#img‘).click(function(){
$(this).toggleClass(‘min‘);
$(this).toggleClass(‘max‘);
});
});
</script>
<html>
<img id=‘img‘ class=‘min‘ src=‘dream.png‘>
</html>
js替換內容
var statusinfo="";
if(datas[i].satus == 1){
statusinfo=‘已取消‘
}else if(datas[i].status == 2){
statusinfo=‘已接受‘
}else{
statusinfo=‘待接受‘
}
order_list += "<p class=‘order_list_info‘>狀態：" + statusinfo + "</p>"
jQuery課題
//代替原生的獲取dom var sidebar = $(‘.#sidebar‘) mask = $(‘.mask‘)
//操作css屬性！！！這個之前學習中每次用次次忘，，啊
//操作單個css屬性
css("propertyname","value");//註意要加冒號的啊！！！
jq.css("color","#000")
//操作多個css屬性，就是json格式
css({"propertyname":"value","propertyname":"value",...});//註意還是要加冒號的啊！！！
jq.css({"color":"#000","font-size":"10px"})//json格式每個小內容都用逗號隔開，然後鍵值中間用引號，外面給他穿件{}花括號。
//操作屬性attr(),用法同css()
//animate()方法
$(‘html,body‘).animate({scrollTop:0},600)//理解：鍵值對，鍵就是要執行的動作，值就是時間或者距離咯，跟隨鍵的不同而不同，當然後面那個600也不是必填的。
使用typeof返回變量類型
document.write(typeof temp) var temp = 100; //輸出number
截取字符串
//例子 var params = document.referrer; //params:?id,date var id = params.substring(42);
$.getUrlParam = function(name) { var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r!=null) return unescape(r[2]); return null; } var id = $.getUrlParam(‘id‘);//截取鏈接中的id的值
回顧js基礎知識
document.style.color="#cccccc"; document.innerHTML="hello world"; function myFunction(a,b) { return a*b; } document.getElementById("demo").innerHTML=myFunction(4,3);//12
JavaScript知識點小記