- 博客(25)
- 收藏
- 关注
RSS订阅原创 jQuery 表单的操作
Hello World !!!" //$(':text') == $('input[type=text]') //添加/修改属性 $(':text').attr('placeholder','请输入用户名！'); //获取placeholder即属性上的值 console.log($(':text').attr('placeholder')); // 移除inp
2017-10-25 19:56:13
491
原创 jQuery 元素的克隆 clone()
var input1 = $('input'); input1.on('click',function(){ alert('动态添加的内容！'); }); //clone() 浅克隆 $('input').clone().appendTo($('body')); //clone(true) 深克隆 可以将动态添加的行为等克隆进去 $('input').clon
2017-10-25 19:55:25
1710
原创 jQuery 元素的删除
class1 class2 删除父节点 // 清空该节点下的所有后代节点 // div[class=line1] 在div里过滤筛选样式 $('div[class=line1]').empty(); $('.class1').empty(); // 清空该节点下的所有后代节点 $('.class2').html(''); //
2017-10-25 19:54:46
361
原创 jQuery 元素的追加
星期天 // 在元素里的后面位置添加一个新的节点 $('ul').append('星期一'); // 添加到父节点(父节点的最后一个位置) $('星期二').appendTo($('ul')); // 在元素的第一个节点处添加一个元素 $('ul').prepend('星期六'); //把自身添加到父节点的第一个元素之前的位置 $('星期六e
2017-10-25 19:54:11
360
原创 jQuery stop()用法
div{ width: 100px; height: 100px; background: red; } $('div').on('mouseover',function(){ $(this).animate({width:600,height:600},3000,function(){ $(this).anim
2017-10-25 19:53:08
463
原创 jQuery 自定义动画
div{ width: 60px; height: 30px; background: red; } /*自定义动画效果，样式只能设置一个值， * 例如设置字体大小，只能使用fontSize而不能用font， * 设置的样式有限具体参考 * http://www.w3school.com.cn/jquery/e
2017-10-25 19:52:06
225
原创 jQuery slideDownUp动画效果
*{ margin: 0;padding: 0; list-style: none; } title_1 12 12 title_2 12 12 title_3 12 12
2017-10-25 19:51:14
237
原创 jQuery showHide动画效果
手风琴效果 *{margin:0;padding:0;} ul, li{list-style: none;} 员工管理 个人信息 .... 部门管理 部门信息 .... 系统管理 系统信息
2017-10-25 19:50:03
797
原创 jQuery css方法操作
#box{width: 100px;height: 100px;/*background: red;*/} .class{background: lavender;} //单一 只设置一种样式 $('#box').css('border','1px solid red'); //多种 用json方法存放添加 $('#box').css({hei
2017-10-25 19:48:43
231
原创 jQuery过滤器
1 2 3 4 5 6 7 8 // :odd 奇数行选择器 因为index是由0开始算的 所以0是偶数行 $('ul li:odd').css('background-color','greenyellow'); // :even 偶数行选择器 $('ul li:even').css('background-
2017-10-24 20:37:10
241
原创 jQuery层级选择器
title_1 li_1_1 li_1_2 title_2 li_2_1 li_2_2 div1 div2 div3 div4 div5 p1 span1 (function(){ // 后代选择器 子辈和
2017-10-24 20:36:13
194
原创 jQuery基本选择器
divID line1 line2 line3 p标签 //ID选择器 $('#id').css('border','10px solid red'); //className 用类名选择 $('.line').css('border','2px solid blue'); //element 元素选择 $('p').css('
2017-10-24 20:34:57
187
原创 用json方法使宽高同时变.html
div{ width: 100px; height: 100px; background: red; float: left; margin: 20px; } 哈哈 window.onload = function(){ var oBox1 = document.getElementById('box1');
2017-10-20 20:06:25
358
原创 解决scrollTop兼容问题 document.documentElement.scrollTop || document.body.scrollTop
在设计页面时可能经常会用到固定层的位置，这就需要获取一些html对象的坐标以更灵活的设置目标层的坐标，这里可能就会用到document.body.scrollTop等属性，但是此属性在xhtml标准网页或者更简单的说是带标签的页面里得到的结果是0，如果不要此标签则一切正常，那么在xhtml页面怎么获得body的坐标呢，当然有办法-使用document.documentElement来取代docum
2017-10-19 11:05:40
1619
原创 JavaScript动画效果 opacity 透明度变化
#box { width: 200px; height: 200px; background: red; opacity:0.2; /*这是解决透明度在IE上的兼容问题*/ filter:alpha(opacity=20); } window.onload = function() { va
2017-10-19 08:57:48
3451
原创 缓冲运动 //缓冲运动 (目标值 - 当前值)/10
#box{ width: 200px; height: 200px; background: pink; position: absolute; left: 0; } window.onload = function(){ var oBox = document.getElementById('box');
2017-10-18 20:22:55
271
原创 获取样式的时候用offsetWidth 这类有Bug 要用 obj.currentStyle.width 或getComputedStyle(obj,null).width
div{ width: 100px; height: 100px; background: red; float: left; margin: 20px; } 哈哈 window.onload = function(){ var oBox1 = document.getElementById('box1')
2017-10-18 20:02:26
849
原创 JavaScript选项卡
*{ padding: 0;margin: 0;list-style: none; } #ul{ height: 20px; } #ul li{ float: left; width: 40px; height: 20px; } #smallbox{ width: 160px; height: 100px;
2017-10-18 19:59:50
247
原创 a++ 与 ++a
var a = 1, b = 2, c = 3;if(a++==b){ //是直接用a=1 和b=2 进行判断，不会让a++之后再判断 alert(a-1);}else{ alert(b); //如果alert(a); 那么结果是2 是a++之后的结果} //最后的结果是弹出b=2 数值2;var a = 1, b = 2, c = 3;if(++a==b){ //是用a++ 之后的
2017-10-18 19:58:45
560
原创 多个盒子的透明度变化--要给每个盒子设置透明度的初始值(oDiv[i].alpha=20;)
div{ width: 100px; height: 100px; background: red; margin-bottom: 20px; opacity: 0.2; filter: alpha(opacity = 20); } function changes(obj,target){ clearInterval(obj.timer
2017-10-18 19:34:01
1149
原创 多盒子的运动---用目标值减去对象的变量属性(target - obj.offsetWidth)
function move(obj,target){ clearInterval(obj.timer); //obj.timer 是给每个div都添加上这个timer定时器 obj.timer = setInterval(function(){ //声明每次执行定时器的改变量为speed 即是缓冲运动的公式 //(目标函数的值 减去 对象的变量) 除以1
2017-10-18 19:22:57
340
原创 a++与++a 的区别
var a = 1, b = 2, c = 3;if(a++==b){ //是直接用a=1 和b=2 进行判断，不会让a++之后再判断 alert(a-1);}else{ alert(b); //如果alert(a); 那么结果是2 是a++之后的结果} //最后的结果是弹出b=2 数值2;var a = 1, b = 2, c = 3;if(++a==b){ //是用a++ 之后的结
2017-10-09 20:23:50
437
原创 JavaScript选项卡
*{ padding: 0;margin: 0;list-style: none; } #ul{ height: 20px; } #ul li{ float: left; width: 40px; height: 20px; } #smallbox{ width: 160px; height: 100px;
2017-10-09 19:55:09
282
原创 css day02
1、ul>li 无序列表 ol>li 有序列表 去掉样式：list-style: none;（list 列表）2、dl>dt+dd 自定义列表（少用）3、插入图片：4、超链接：百度（target ：子页面的打开方式; _blank 新建页面打开； _parent 本页面|原来页面打开）（去掉a链接下面的下划线：text-decoration: none; 改变字体颜色：co
2017-09-09 16:05:39
115
原创 css day01
1、meta标签 提高关键字搜索率 2、-标签 字体大小 由大到小 是块级元素3、常用的： div p h1-h6 ul ol 块级元素 将块级元素转为行级元素：display：inline； a span 行级元素 将行级元素转为块级元素： display：block；4、 换行标签 分割线（可以设置width，height，color等）5、字体
2017-09-09 11:30:37
216
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人