JS與JQ的區別

標籤：使用者   function   ndt   添加   remove   alert   on()   頁面   info   

1、擷取元素 <重點>

   var info=document.getElementById("tex1");

   var info=$("#tex1");

2、擷取值<重點>

   var info=document.getElementById("tex1").value;

   var info=$("#tex1").val();

   //對於文字框等有value屬性的(例如input、radio、checkbox等)可以使用上面的方法，沒有value屬性的（例如div、span、p等）可以使用下面的

   var info=document.getElementById("tex1").innerHTML;

   var info=$("#tex1").text();

3、賦值<重點>

    var info=document.getElementById("p1").value="123";

    var info=$("#tex1").val("123");

    //對於文字框等有value屬性的(例如input、radio、checkbox等)可以使用上面的方法，沒有value屬性的（例如div、span、p等）可以使用下面的

    var info=document.getElementById("tex1").innerHTML;

    var info=$("#tex1").text("123");

4、添加元素<下面都是瞭解>

   a對象.appendChild(b對象)    將b對象添加到a裡面 （動態下拉框js實現）

   a對象.appendChildTo(b對象)  將a添加到b         （動態下拉框jquery實現）

5、移除元素

   document.getElementById("ul").removeChild(當前元素);//只能移除子項目

   $("#div1").remove();//可以移除當前元素

6、建立元素

   var newNode = document.createElement("P");//建立一個P標籤  

   var select = $("<select/>").appendTo($("body"));//在body裡面建立一個下拉框

   var option1 = $("<option value=\"1\">text1</option>").appendTo(select);//在下拉框裡面建立option並添加

7、載入函數

   window.onload=function(){

   }

   $(function(){

   })

 

  總結：

      1、js的dom一般都是以document開頭

      2、js的bom一般都是以window開頭

      3、jquery一般都是以$("")開頭，方法都是有括弧的 比如擷取值val()等等，細節參看以上描述

  注意事項：

      1、一句完整的代碼不能出現jquery和js混搭，比如擷取對象的值document.getElementById("tex1").val(); 是不對的，

      分析：document.getElementById("tex1")是js寫法，val()是jquery的方法

      2、但是一個方法裡面可以出現js和jquery混用，比如  一個登陸頁面

      function doTest(){

                var username=document.getElementById("username").value;//該寫法是js寫法擷取使用者名稱

                var pwd=$("#tex1").val();//該寫法是jquery寫法擷取密碼

                if(""==username){

                alert("使用者名稱不可為空");

                return;

                    } ;

      };

      3、代碼一定要寫規範，分號該加就加，嚴格要求自己，增加領導認可程度，方便自己以及其他人，避免不必要的bug

      4、方法名變數名一定要有意義

      5、不要使用中文定義檔案名稱

 

   

 

JS與JQ的區別