码迷,mamicode.com
首页 > Web开发 > 详细

jQuery对象的创建

时间:2018-08-26 18:18:15      阅读:363      评论:0      收藏:0      [点我收藏+]

标签:轻量   下标   meta   扩展   资源   javascrip   NPU   并且   开始   

1.js类库

 

  JavaScript封装了很多的预定义的对象和实用函数,能帮助使用者建立有高难度交互
客户端页面,并且兼容各大浏览器。跑在浏览器,请求服务器

当前比较流行的js库:   

  •   jquery
  •   EXT_JS 2.0开始收费
  •   Dojo 需要引入很多js单独文件
  •   Prototype 对js扩展,框架开发
  •   YUI
  •   淘宝UI

jquery介绍:

  •    轻量级:依赖程序少,占用资源少
  •   兼容CSS3
  •   文档说明很全
  •   js代码和html代码分离
  •   免费开源

分类:   

  • WEB版本
  • UI版本
  • mobile版本
  • qunit版本:用于js测试

2.jQuery基本语法

  案例:

  

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 5 <title>Insert title here</title>
 6 </head>
 7 <script src="../js/jquery-1.8.3.js"></script>
 8 <body>
 9     <input type="text" id="username" value="jack"/>
10 </body>
11 </html>
12 <script type="text/javascript">
13     //jquer执行时有加载顺序
14     //jquery基本语法
15     var value = $("#username").val();
16     alert(value);
17     //1.使用javascript获取DOM对象
18     var value1 = document.getElementById("username");
19     alert(value1.value);
20 
21     //2.将DOM对象转换为jquery对象
22     var $value1 = $(value1);
23     alert($value1.val());
24 
25     //3.将jquery对象转换为DOM对象
26     //jquery对象内部使用数组存放所有数据,可以用数组下标获取DOM对象
27     var value2 = $value1.get(0);
28     alert(value2.value);
29 </script>

注意js是有执行顺序的,它是在页面加载完成之后才会执行,因此我们应该讲script代码,放在body之后,同时需要注意引入外部js的写法:

 

<script src="../js/jquery-1.8.3.js"></script>

 

 

 不要写成这种的:

<script src="../js/jquery-1.8.3.js"/>

 

jQuery对象的创建

标签:轻量   下标   meta   扩展   资源   javascrip   NPU   并且   开始   

原文地址:https://www.cnblogs.com/jxxblogs/p/9537726.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!