当前位置:编程学习 > JS >>

jquery第三期:js与jquery对象转换

我们开始进入jquery的学习了,jquery的学习就不那么中规中矩了,我们来看一个和javascript有所区别的地方。
[html]  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
<title>Insert title here</title>  
<script type="text/javascript" src="jquery-1.10.1.js"></script>  
<script type="text/javascript">  
   window.onload = function()  
   {  
       alert("niujiabin");  
    }  
  
    window.onload = function()  
    {  
        alert("bcd");  
        }  
  
  
</script>  
</head>  
<body>  
</body>  
</html>  
结果是:
弹出niujiabinbin的提示框,但是我们改写成jquery:
[html]  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
<title>Insert title here</title>  
<script type="text/javascript" src="jquery-1.10.1.js"></script>  
<script type="text/javascript">  
   $(function()  
   {  
       alert("abc");  
  
       });  
    $(function(){  
          
        alert("bcd");  
        });  
  
</script>  
</head>  
<body>  
</body>  
</html>  
 
结果却是两个都输出了,我们可以看出,jquery的加载方式进行了变化,那么这样的好处是什么呢?
如果引用两个js文件的function,那么会产生覆盖问题,jquery使用闭包解决了此问题。
 
下面我们看一看js对象和jquery对象:
下面的代码能找出错误么?
[html] 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
<title>Insert title here</title>  
<script type="text/javascript" src="jquery-1.10.1.js"></script>  
<script type="text/javascript">  
   $(function()  
   {  
     var hello = document.getElementById("hello");  
     hello.css("color","red");  
    });  
</script>  
</head>  
<body>  
<div id="hello">  
  <ul>  
    <li>niujiabin</li>  
    <li class="abc">maybe</li>  
    <li>gossipgo</li>  
  </ul>     
</div>  
  
</body>  
</html>  
 
补充:web前端 , JavaScript ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,