jQuery訪问属性,绝对定位
2016-03-13 21:43
671 查看
一. jQuery訪问属性
二. jQuery绝对定位
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery attr demo</title> </head> <body> <input id="check" type="checkbox" checked="checked"> <label for="check">复选框</label> <p></p> </body> <script type="text/javascript" src="jquery-2.1.1.min.js"></script> <script type="text/javascript"> $(function(){ $("input").change(function(){ var $input = $(this); $("p").html(".attr('checked') = <b>" + $input.attr('checked') + "</b><br>" + ".prop('checked') = <b>" + $input.prop('checked') + "</b><br>" + ".is(':checked') = <b>" + $input.is(':checked') ); }).change(); }) </script> <style> b {color: red;} </style> </html>
二. jQuery绝对定位
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery absolute fix demo</title> </head> <body> <div>盒子1</div> <div style="float:left">盒子2</div> <div style="float:left">盒子3</div> </body> <script type="text/javascript" src="jquery-2.1.1.min.js"></script> <script type="text/javascript" > $(function(){ var o1 = $("div").eq(0).offset(); //获取第一个div元素的偏移信息 $("div").eq(0).html( "left: " + o1.left + "<br />top: " + o1.top ); //显示信息 var o2 = $("div").eq(1).offset(); //获取第二个div元素的偏移信息 $("div").eq(1).html( "left: " + o2.left + "<br />top: " + o2.top ); //显示信息 var o3 = $("div").eq(2).offset(); //获取第三个div元素的偏移信息 $("div").eq(2).html( "left: " + o3.left + "<br />top: " + o3.top ); //显示信息 }) </script> <style type="text/css"> body { padding:0; margin:0; }/*清除页边距*/ div {height:60px; width:200px; border:solid 10px red; }/*统一div元素的显示样式*/ </style> </html>
相关文章推荐
- springMVC框架下JQuery传递并解析Json数据
- 细说jQuery原型的创建和实现原理,并用实例简单模仿
- JqueryAjax
- JQuery编程demo练习
- day14—JQuery编程基础
- 又一个ajax实例,结合jQuery
- 什么是事件起泡?用jQuery阻止事件起泡
- jquery+struts2+json省市县三级联动
- jQuery的$.getJSON方法在IE浏览器下失效的解决方案
- etmvc+jQuery EasyUI Highcharts实现柱状图
- 菜鸟的Jquery validate入门
- jQuery(二)
- jquery插件-表单验证插件-rules
- jquery插件-表单验证插件-validator对象
- 使用jQuery.form插件,实现完美的表单异步提交
- 使用jQuery操作HTML的table表格的实例解析
- jquery点击当前对象,并alert文本内容
- PHP——菜单及内容轮换(Jquery)
- 常用jquery插件资料
- Jquery Ajax 跨域之JSONP方式极简示例,服务端是.net的ashx