jquery对象和原生JavaScript对象

代码

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=utf-8"   />
< title > 自动换行 </ title >
< script  src ="../jQuery/jquery-1.3.1.js"  type ="text/ecmascript" ></ script >
< style  type ="text/css" >
* {  margin : 0 ;  padding : 0 ;  border : 0 ; }
.text {  width : 500px ;  height : 500px ;  margin : 20px auto ;  background-color : #CCC ;  padding : 10px ; }
</ style >
</ head >

< body >
   < p  id ="text"  class ="text" > aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa </ p >
< script  type ="text/javascript" >
  // jquery对象不能使用原生的JavaScript对象的方法
  // 如果想使用原生JavaScript对象的方法，可以通过get()方法将jquery对象转化为原生的JavaScript对象。
   function  breakWords(maxLen,obj){
       var  text = $(obj).text();    // jquery的text()方法返回的是原始的字符串数据类型，所以可以使用原生的js方法。
       var  temp = "" ;
       while (text.length > maxLen){
          temp += text.substr( 0 ,maxLen) + " <br /> " ;   // substr是原生JavaScript字符串对象的方法
          text = text.substr(maxLen,text.length);
      };
      temp += text;
      $(obj).html(temp);   // 这里不能使用innerHTML因为${obj}是jquery对象。另外jquery对象的html()和text()方法是不一样的，这里使用html()而不用text()
  }
  breakWords( 50 , " #text " );
</ script >
</ body >
</ html >

 

当应用了jquery时，在使用过程中一定要区分当前的操作对象是jquery对象还是原生的JavaScript对象。jquery对象只能使用jquery中定义的方法和属性，而不能使用原生的JavaScript对象的方法和属性。JavaScript对象也是类似的。当然jquery对象可以通过get()方法转化为JavaScript对象，也可以通过$来创建jquery对象。