Jquery样式操作
< html xmlns ="http://www.w3.org/1999/xhtml"> < head> <title > JQuery样式操作</ title > <style type="text/css"> #div1 {color : Red;} </style > <script src="js/jquery-1.5.1.min.js" type="text/javascript"></ script > <script type="text/javascript"> $( function () { var $divs = $("div" ); //1.为css传一个参数,是获得 指定的 样式 值 //var col = $divs.css("color");//即使是在类样式中定义color 仍然可以得到red结果 不同于js //alert(col); //2.设置 一个 样式 的值 //$divs.css("color", "blue"); //3.一次设置多个样式的值 传入json格式 //$divs.css({ "color": "#ff6600","fontSize":"88px" }); //var $divs2 = $divs.css("color", "blue").css("fontSize", "88px"); //$divs2.slideUp(5000);//因为Jquery会返回修改的对象 所以可以实现链式编程 //4.设置 元素的 value属性值 //$("#txtName").val("哈哈哈哈哈"); //alert($("#txtName").val()); //5.使用 text()方法 设置 文本(innerText) //$("#div2").text("<div>王小丫,是男的?</div>"); // var $waoxiaoya = $("#waoxiaoya");//Jqurey中的迭代 如果Jquery对象数组$waoxiaoya长度为空的话 自然就不会执行.html方法了 //if ($waoxiaoya.length > 0) { // $$waoxiaoya.html("哈哈哈哈哈,你丫不存在!"); //} }) </script > </ head> < body> <div id="div1"> 123123 </div > <div id="div2"> 123123 </div > <input type="text" id="txtName" /> </ body> </ html>
JQuery操作兄弟元素
< html xmlns ="http://www.w3.org/1999/xhtml"> < head> <title > JQuery Dom操作</ title > <style type="text/css"> #div1 {color : Red;} </style > <script src="js/jquery-1.5.1.min.js" type="text/javascript"></ script > <script type="text/javascript"> $( function () { var $divs = $("div" ); //使用attr()方法读取或者设置元素的属性 //$divs.eq(0).attr({ "title": "{id:11}", "name": "哈哈哈" }); //json键值对格式 一次赋多值 //$divs.eq(1).attr("title", "2222222"); //eq(0)拿索引 $divs.eq(1)拿到的是一个dom元素 又放在一个新的Jquery对象中 所以能调用attr //alert($divs.attr("name"));//一个参数的话就是取值 如果$divs是多值数组 默认返回第一个name属性值 //移除属性 //$divs.removeAttr("name"); //alert($divs.attr("name")); //2.获得紧挨着的一个Jquery对象 var $nextNode = $("#div1" ).next( "input"); //.next()如果没有参数 则返回下一个Jquery对象 不论任何类型 如果下一紧挨对象不是input类型 那么返回undefined //alert($nextNode.id);//undefined 因为$nextNode是Jquery对象 如果想拿id需通过$nextNode.attr("id") //$.map($nextNode, function (item) {//再次强调:循环是直接拿到Jquery数组中的dom元素 所以可以直接点出id 不同以上 // alert(item.id); //}); //3.获得后面的所有的兄弟元素(Jquery对象) //var $nextNode = $("#div1").nextAll();//也可以指定id选择器"#txtName2" 或者元素选择器"input" 无参数则获得所有的 //$.map($nextNode, function (item) { // alert(item.id); //}); //4.获得前面的所有的兄弟元素(Jquery对象) //var $nextNode = $("#div1").prevAll();//prevAll=》nextAll prev=》next //$.map($nextNode, function (item) { // alert(item.id); //}); //5.获得所有的同辈兄弟元素(Jquery对象) 相当于取prevAll 和 nextAll所有值 var $nextNode = $("#div1" ).siblings( "div") //可以有参数对类型进行限制 也可以为空(取得所有) $.map($nextNode, function (item) { alert(item.id); //div4 div2 }); }) </script > </ head> < body> <input type="text" id="Text2" /> <div id="div4"> 123123 </div > <input type="text" id="Text1" /> <div id="div1"> 123123 </div > <input type="text" id="txtName" /> <input type="text" id="txtName2" /> <div id="div2"> 123123 < div id ="div3">123123 </ div> </div > </ body> </ html>
相关推荐
Jquery速成教程,对你绝对有帮助,不下载就后悔啦
你知道JQuery吗?你想学会JQuery吗?绝对好东西!
大家都知道jquery版本有好多,之间冲突很纠结。 比如我刚来这公司的时候,后端的哥们用的是jQuery 1.3.2,我了个去,那哥们好久没更新了。 我写的效果插件都是最新的jquery1.7.1。 不兼容蛋疼啊,参考前人资料,看书...
我们实习的时候,团队中各组员...请私信,我会无偿发到你的邮箱里……我们都知道,,做程序,包括做人,我们都要学会去跟别人分享,要有一颗感恩的心,所以要回馈自己最好的东西给别人~~~欢迎大家下载~~~祝君工作顺心
jQuery小例子源码 1.客户端事件的注入.Whindom.onload,jquery-->(document).ready(function(){内容}); 2.css样式表中的元素,类,元素ID是设置,及其就近原则,类高。 3.知道了,css中border属性,background-image...
自从jQuery面世以来,它以其快速、简洁,能够很轻易地处理HTML文档、控制事件、给页面添加动画和Ajax效果等打动着所有关注它的人的心,本人也不例外,但长期以来,类似与本手册的(带查询功能),仅仅只有kuomart(这里...
以前习惯在input 元素上写onclick = "fn()",使用jquery可以使javascrīpt代码与html代码分离,保持HTML的清洁,还可以很轻松地绑定事件,甚至你可以不知道“事件”这个名词。 代码 $(document).ready(function() { $...
jQuery UI 是建立在 jQuery JavaScript 库上的一组用户界面交互、特效、小部件及主题。...所有的 jQuery UI 小部件(Widget)使用相同的模式,所以,只要您学会使用其中一个,您就知道如何使用其他的小部件(Widget)。
你可能听说过jquery能帮你为网站和应用增加交互性,但是不知道从哪里入手,是这样吗? 《head first jquery(中文版)》就是你的车票,拿到这张车票,你就能轻松地构建漂亮的交互式web网站,就像真正的应用一样。 ...
jquery最新的帮助文档,很详细,真的非常好,谁看谁知道,绝对不忽悠
jQuery是一个快速简洁的javaScript库,极大地简化了JavaScript 编程。它能够快速方便的处理HTMLdocuments、events、实现动画效果并且为网站提供AJAX交互。jQuery软件文档说明很...不知道能不能用哦,大家下载试试吧。
自从jQuery面世以来,它以其快速、简洁,能够很轻易地处理HTML文档、控制事件、给页面添加动画和Ajax效果等打动着所有关注它的人的心,本人也不例外,但长期以来,类似与本手册的(带查询功能),仅仅只有kuomart(这里...
最新jquery-ui-1.11.2日期控件,官网下载内涵图片和自己添加的中文辅助jquery-ui-timepicker-zh-CN.js,经过本人测试绝对可以用,不知道怎么用的百度上找个例子即可,需要导入的包 ${ctx}/plugins/jquery-ui-1.11.2/...
asing插件大家也许一直在用,非常的不错,能实现很多你想要的效果,并且jquery的很多内置方法也开始支持Easing参数了,经常使用jquery的朋友一定会知道需要下载这个jar包
好东西不需要过多的言辞修饰,下了就知道! 所有效果说明: 基本的鼠标互动: 拖拽(drag and dropping)、排序(sorting)、选择(selecting)、缩放(resizing) 各种互动效果: 手风琴式的折叠菜单(accordions)、...
自从jQuery面世以来,它以其快速、简洁,能够很轻易地处理HTML文档、控制事件、给页面添加动画和Ajax效果等打动着所有关注它的人的心,本人也不例外,但长期以来,类似与本手册的(带查询功能),仅仅只有kuomart(这里...
jquery的1.11.3api文档,包含2份文件,在编写jquery代码时模糊的方法名,或不知道功能的方法可使用此文档查看。
通过本文的介绍,你就会知道jquery都能做到什么。您可以根据实际需求选择适合自己的开发插件,很实用哦。
你可能听说过jquery能帮你为网站和应用增加交互性,但是不知道从哪里入手,是这样吗? 《head first jquery(中文版)》就是你的车票,拿到这张车票,你就能轻松地构建漂亮的交互式web网站,就像真正的应用一样。 ...
自从jQuery面世以来,它以其快速、简洁,能够很轻易地处理HTML文档、控制事件、给页面添加动画和Ajax效果等打动着所有关注它的人的心,本人也不例外,但长期以来,类似与本手册的(带查询功能),仅仅只有kuomart(这里...