jQuery 操作

Posted 2020-08-07 杜Amy

addClass() - 向被选元素添加一个或多个类
removeClass() - 从被选元素删除一个或多个类
toggleClass() - 对被选元素进行添加/删除类的切换操作
css() - 设置或返回样式属性<br/>

width() 方法设置或返回元素的宽度（不包括内边距、边框或外边距）。
height() 方法设置或返回元素的高度（不包括内边距、边框或外边距）。

innerWidth() 方法返回元素的宽度（包括内边距）。
innerHeight() 方法返回元素的高度（包括内边距）。

outerWidth() 方法返回元素的宽度（包括内边距和边框）。
outerHeight() 方法返回元素的高度（包括内边距和边框）。

 1 <script>
 2     $(function(){
 3         $("button").click(function(){
 4             $("p").addClass("blue");
 5         })
 6     })
 7     $(document).ready(function(){
 8         $("button").click(function(){
 9             var text="";
10             text+="width of div:"+$("#div1").width()+"</br>";
11             text+="height of div:"+$("#div1").height();
12             $("#div1").html(text);
13 
14         })
15 
16         $("button").click(function(){
17             var txt="";
18             txt+="width:"+$("#div1").width()+"</br>";
19             txt+="height:"+$("#div1").height();
20 
21             txt+="width:"+$("#div1").innerWidth()+"</br>";
22             txt+="height:"+$("#div1").innerHeight();
23 
24             txt+="width:"+$("#div1").outerWidth()+"</br>";
25             txt+="height:"+$("#div1").outerHeight()
26             $("#div1").html(txt);
27         })
28 
29     })
30 </script>