自定義博客cnblogs樣式的必備前端小知識——js、jq

JQ、JS相關小知識

任意元素自動點擊

$(".editicon").trigger('click')

 

添加子元素

• append() - 在被選元素的結尾插入內容
• prepend() - 在被選元素的開頭插入內容
• after() - 在被選元素之后插入內容
• before() - 在被選元素之前插入內容

 

刪除、清空子元素

$(".p").empty();　　  //不會刪除自己       //刪除內部所有子節點
$(".p").remove();　　//會刪除自己        //刪除當前子節點(綁定的不能用)
$(".p").detach();　　//會刪除自己        //刪除當前子節點(綁定的能用)

 

獲取圖片的src屬性值

var demoJQ = $('#demo');
demoJQ.attr('src')
or
demoJQ[0].src

 

延遲執行

setTimeout(function(){
    console.log("延遲600ms 執行");
},600);

 

定時執行

setInterval(function(){
    console.log("600ms執行一次");
}, 600)

 

JS打開新標簽頁

window.open("http://www.wlzhys.com", "_blank"); //注意第二個參數

 

判斷字符串中是否包含某個字符串

方法一：indexOf()

indexOf() 方法可返回某個指定的字符串值在字符串中首次出現的位置。如果要檢索的字符串值沒有出現，則該方法返回 -1。

var str = "123";
console.log(str.indexOf("3") != -1 );  // true

方法二：search() 

search() 方法用於檢索字符串中指定的子字符串，或檢索與正則表達式相匹配的子字符串。如果沒有找到任何匹配的子串，則返回 -1。

var str = "123";
console.log(str.search("3") != -1 );  // true

方法三:match()

match() 方法可在字符串內檢索指定的值，或找到一個或多個正則表達式的匹配。

var str = "123";
var reg = RegExp(/3/);
if(str.match(reg)){
    // 包含        
}

 

頁面加載完后執行JS的方式

方式一：js自帶方法

<script type="text/javascript">
   window.onload = function () {
       //方法內容
   }
</script>

方式二：jq常用方式

<script type="text/javascript">
    $(function () {
        alter("123qew");
    })
</script>

 

獲取當前頁面URL

url = window.location.href; /* 獲取完整URL */
/* http://127.0.0.1:8020/Test/index.html#test?name=test */
 
url = window.location.pathname; /* 獲取文件路徑（文件地址） */
/* /Test/index.html */
 
url = window.location.protocol; /* 獲取協議 */
/* http */
 
url = window.location.host; /* 獲取主機地址和端口號 */
/* http://127.0.0.1:8020/ */
 
url = window.location.hostname; /* 獲取主機地址 */
/* http://127.0.0.1/ */
 
url = window.location.port; /* 獲取端口號 */
/* 8020 */
 
url = window.location.hash; /* 獲取錨點（“#”后面的分段） */
/* #test?name=test */
 
url = window.location.search; /* 獲取屬性（“?”后面的分段） */