Kampfer的记事本

新blog:www.kampfer-lw.com

导航

jquery对象和原生JavaScript对象

Posted on 2010-08-28 21:33  Kamfper  阅读(637)  评论(0编辑  收藏  举报
代码
<!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>
  
<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对象。