JQuey练习一

$();css();size();

View Code

1 <html xmlns="http://www.w3.org/1999/xhtml">
2 <head>
3     <title>Jquery函数</title>
4     <script src="../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
5     <script type="text/javascript">
6         $(function () {
7             // 获取body中DIV的个数
8             var html = $('div');
9             if (html) {
10                 for (var i = 0; i < html.length; i++) {
11                     if (html[i].id == 'div3') {
12                         break;
13                     }
14                     $('#spResult').append(html[i].innerHTML);
15                 }
16             }
17             //创建个新DIV添加到body中
18             html = null;
19             html = $('<div>第四个DIV</div>');
20             html.appendTo('body');
21
22             //创建个checkbox添加到body中
23             html = null;
24             html = $('<input />', {
25                 type: 'checkbox',
26                 click: function () {
27                     alert('Hello !');
28                 }
29             });
30             html.appendTo('body');
31
32             // 设置body样式
33             $('body').css({'background-color': 'blue','color':'red'});
34
35             // 统计DIV个数
36             $('#spResult').append('<br/>DIV个数：' + $('div').size());
37             // 统计INPUT个数
38             $('#spResult').append('<br/>INPUT个数：' + $('input').size());
39             // 统计INPUT-TEXT个数
40             $('#spResult').append('<br/>INPUT-TEXT个数：' + $('input:text').size());
41             // 统计是只读的INPUT-TEXT个数
42             $('#spResult').append('<br/>INPUT-TEXT只读个数：' + $('input:text[readonly]').size());
43             // 统计ID为div3的子控件中INPUT-TEXT的个数
44             $('#spResult').append('<br/>DIV3中INPUT-TEXT个数：' + $('#div3>input:text').size());
45         });
46     </script>
47 </head>
48 <body>
49 <input  type="text" readonly="readonly"/>
50 <div id="div1">第一个DIV</div>
51 <div id="div2">第二个DIV</div>
52 <div id="div3">第三个DIV
53 <input type="radio" />
54 <input  type="text"/>
55 </div>
56 <hr />
57 <span id="spResult"></span>
58 </body>
59 </html>

相关阅读:
「训练反思18」（8.16）认清自己
「训练日志17」（8.12）崩盘
「训练日志16」 8.11 下坠
「训练日志15」（8.10）
「训练反思15」（8.10）
「训练日志14 」（8.9）失败
训练日志13 （8.7）
Linux 设置vim指令
训练日志12 （8.5）
训练反思12 （8.5）

原文地址：https://www.cnblogs.com/mimengjiangnan/p/2279359.html