當前位置：
首頁 >
JQuery的摸索之路（二比较）
發布時間：2025/3/20
19
豆豆
生活随笔
收集整理的這篇文章主要介紹了
JQuery的摸索之路（二比较）
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1.修改text1里的值為‘abc’
?? 我們傳統的做法是：
?
1 window.document.form1.Text1.value=‘ABC’;?
再精簡的做法是
?
document.getElementById(‘Text1’).value=‘ABC’;document.all(‘Text1’).value=‘ABC’; //(只支持IE)
JQuery的寫法是：
?
1 $(‘#Text1’).val(‘ABC’);?
2.按下按鈕顯示隱藏div的內容：
傳統的做法
?
1 function button1_onclick() {2 var div1=document.getElementById('div1');
3 if(div1.style.display=='')
4 {
5 div1.style.display='none';
6 }
7 else
8 {
9 div1.style.display='';
10 }
11 }
12 ?
JQuery做法
?
1 $('#button2').click(function(){2 $('#div2').toggle();
3 });
4 ?
html代碼：
?
代碼 1 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="JqueryDemo1.aspx.cs" Inherits="JqueryDemo1" %>2
3 ?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4
5 ?<html xmlns="http://www.w3.org/1999/xhtml">
6 ?<head runat="server">
7 ?<script type="text/javascript" src="js/jquery-1.3.2-vsdoc2.js"></script>
8 ?<style>
9 .d1
10 ?{
11 background-color:Red;
12 color:White;
13 }
14 ?</style>
15 <script type="text/javascript" language=javascript>
16 function button1_click()
17 {
18 var div1=document.getElementById("div1");
19 if(div1.style.display=='')
20 {
21 div1.style.display="none";
22 }
23 else
24 {
25
26 div1.style.display='';
27 }
28
29 }
30
31 $(document).ready(function(){
32 $('#Button2').click(function()
33 {
34 $('#div2').toggle();
35 });
36 }
37 )
38
39 $(document).ready(
40 function(){
41 //給div1加class d1
42 $('#Button1').click(
43 function(){
44 $('#div1').addClass('d1');
45 })
46 //給所有div加 class d1
47 $('#Button2').click(
48 function()
49 {
50 $('div').addClass('d1');
51
52 }
53 )
54
55 }
56 )
57
58
59 </script>
60 <title>未命名頁面</title>
61 </head>
62 <body>
63 <form id="form1" runat="server">
64 <input id="Button1" type="button" value="button" onclick="return button1_click()" />
65 <div id="div1" runat="server">
66 div1<br />
67 div1<br />
68 div1<br />
69 div1<br />
70 div1<br />
71 div1<br />
72 </div>
73 <input id="Button2" type="button" value="button" />
74 <div id="div2" runat="server">
75 div1<br />
76 div1<br />
77 div1<br />
78 div1<br />
79 div1<br />
80 div1<br />
81 </div>
82 </form>
83 </body>
84 </html>
85
?
轉載于:https://www.cnblogs.com/MR_ke/archive/2010/02/26/1674093.html
總結
以上是生活随笔為你收集整理的JQuery的摸索之路（二比较）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： SQL SERVER中架构的理解
- 下一篇： OCFS2+ASM 的RAC安装文档