Jquery $ 符號講解

時間 2021-08-14

標籤 javascript html java jquery app ide 函數 spa xml 欄目 JQuery 简体版

原文原文鏈接

一. $選擇器： $();javascript

替換超連接的內容html

     Html代碼  
      
     
   
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>$選擇器</title>  
<script language="javascript" src="jquery-1.2.6.js"></script>  
<script language="javascript">  
window.onload = function() {  
    var oElements = $("h2 a");  
    for(var i=0;i<oElements.length;i++){  
        oElements[i].innerHTML = i.toString();  
    }  
}  
</script>  
</head>  
<body>  
<h2><a href="#">正文</a>內容</h2>  
<h2>正文<a href="#">內容</a></h2>  
</body>  
</html>  

二. 功能函數前綴： $.trim()java

     Html代碼  
      
     
   
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>$.trim()</title>  
<script language="javascript" src="jquery-1.2.6.js"></script>  
<script language="javascript">  
var str = "  1234567890";  
str = $.trim(str);  
alert(str.length);  
</script>  
</head>  
  
<body>  
</body>  
</html>  

三. ready()方法：jquery

ready()替代window.onload()的方法app

1. $(document).ready(function(){ide

//.....函數

})；ui

2. 簡寫：spa

$(function(){xml

//.......

});

四. 建立DOM元素：

能夠不用之前的document.create....了

     Html代碼  
      
     
   
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>建立DOM元素</title>  
<script language="javascript" src="jquery.min.js"></script>  
<script language="javascript">  
$(function(){     //ready()函數  
    var oNewP = $("<p>這是一個感人肺腑的故事</p>");  //建立DOM元素  
    oNewP.insertAfter("#myTarget");  
});  
</script>  
</head>  
<body>  
    <p id="myTarget">插入到這行以後</p>  
    <p>也就是插入到這行文字以前，可是這行沒有id，也可能不存在</p>  
</body>  
</html>  