web开发日志jquery

1、项目1#first background-color: blueviolet;大雨/id#开头 类定义 .开头项目2外部调用Divbackground-color：blue；#first ，#frist abackground-color：blue；font-size:100px;font-family:”微软雅黑“；color：rgb（254，52，58）;font-weight:bold:font-style: font-variant:Text-decoration：/decoration文本修饰 a和first 有父子级关系 盒子套#first：hover/rel运行样式style t

2、ype神明后缀名调用的是css文件css文件在长沙市中 href 文件路径大雨文字/宋体word /下划线/下划线word/粗体线划线链接 /是链接 之用#就可 盒子没有href就是父级的项目3divwidth:100px;height:100px;background-color: red;position:relative;/移动的定位new$(div).animate(top:200px,2000).animate(left:200px,2000)/挤出去 都要加双引号 写top left必须要在css中写定位$(div).click(function()$(div).animate(t

3、op:200px,2000).animate(left:200px,2000)/鼠标单击事件 function里面复制的上一个代码（）里方的是不同的参数根据各自的需求click()手打的 鼠标单击时 dblclick（）鼠标双击时 Mouseenter（）鼠标移入事件 mouseleave（）鼠标移出new$(div).click(function()$(div).animate(width:500px,2000).animate(width:100px,2000)/两个 这个不需要写定位Ctrl /注释项目4imgdisplay:none;/不是用类定义的不用加.new/button定义 中

4、间没有符号/可以没有class 但是第一次就不显示了$(input).click(function()$(img).css(display,block)/用css来定义的 按钮事件事件触发用别的内容 block 块图片都有大小.imgdisplay:none;/类定义的new/input 要写在开头定义 后面要用到input$(input).click(function()$(img).toggleClass(img)/切换项目5div width:150px;height:500px;background-color: chartreuse;div:nth-of-type(1)div:nth

5、-of-type(2)transition-delay:0.5sdiv:nth-of-type(3)transition-delay:1.5s/延时no/设置三个标签$(div:eq(0).click(/()括号里面是对象function()$(this).css(backgroundColor:red,fontSize:60,textAlign:center,color:black,lineHeight:200px).html(过OFF)/必须加中括号内容多 少的每个都要双引号 this当前对象不加括号 $(“div.first”)符合对象名称的第一个 Last 最后一个 div。eq（数字

6、）当前对象的位置数)$(div:eq(1).click(function()$(this).css(backgroundColor:red,fontSize:60,textAlign:center,color:black,lineHeight:200px).html(年)/html与css获取文字 在网页的标题显示 text 提示作用$(div:eq(2).click(function()$(this).css(backgroundColor:red,fontSize:60,textAlign:center,color:black,lineHeight:200px).html(好)项目6img

7、display: block;/图片的显示/按钮$(img).hide()/一开始图片隐藏$(input:first).click(function()$(img:first).show(1000)/1000时间 show（）显示 hide（）隐藏 fadeIn 淡入 fadeout 淡出 slideDown slideUp 滑动$(img:last).hide()/点击图片1 图片2隐藏)$(input:last).click(function()$(img:last).show(1000)$(img:first).hide()imgdisplay: block;/三个图片$(img).hi

8、de()/图片隐藏$(input:eq(0).click(function()$(img:eq(0).show(1000)$(img:eq(1).hide()$(img:eq(2).hide()/（）里这能写一个对象 三个按钮每个都要隐藏)$(input:eq(1).click(function()$(img:eq(1).show(1000)$(img:eq(0).hide()$(img:eq(2).hide()$(input:eq(2).click(function()$(img:eq(2).show(1000)$(img:eq(1).hide()$(img:eq(0).hide()项目7链

9、接/div占一行 里面套a标签$(a).click(/ 找父级用子标签 function()$(a).parent().css(backgroundColor:red)$(a:parent).parent().css(backgroundColor:red)/找父亲parent（“筛选人物”）parents（） 找祖宗 parentsUntil（）介于两者之间的父级Parents（“body”）)$(div).click(function()$(div).children().css(backgroundColor:red)/children（）点爷爷找爸爸)链接$(.box).click(f

10、unction()$(.box).find(a).css(backgroundColor:red)/a 筛选 必须是div find（） 点爷爷找孙子)111111222222$(div).click(function()$(div).next().css(backgroundColor:red)/next（）下一个)111111222222333333$(div:eq(1).click(/冒号eqfunction()$(div:eq(1).prev().css(backgroundColor:red)/prev上一个)111111222222333333$(div:eq(1).click(f

11、unction()$(div:eq(1).siblings().hide（）)/除了自己以外兄弟)Index（） 位置项目8divwidth:60px;height:60px;background-color:blue;border-radius: 50%; float:left; margin-left: 10px;/形成圆点 旋转$(div:eq(0).click(function()$(div:eq(0).siblings(div).css(backgroundColor:yellow)$(div:eq(0).show().css(backgroundColor:blue)/show 显

12、示颜色 div：eq（0）点击的是第几个div)$(div:eq(1).click(function()$(div:eq(1).siblings(div).css(backgroundColor:yellow)$(div:eq(1).show().css(backgroundColor:blue)$(div:eq(2).click(function()$(div:eq(2).siblings(div).css(backgroundColor:yellow)$(div:eq(2).show().css(backgroundColor:blue)$(div:eq(3).click(function

13、()$(div:eq(3).siblings(div).css(backgroundColor:yellow)$(div:eq(3).show().css(backgroundColor:blue)$(div:eq(4).click(function()$(div:eq(4).siblings(div).css(backgroundColor:yellow)$(div:eq(4).show().css(backgroundColor:blue).boxwidth:372px; height:494px ;overflow: hidden;/盒子框起来.click .span float:lef

14、t;margin-left: 10px;margin-right: 10px; width:10px;height: 10px;background-color: red;border-radius: 50%;/span内联标签 相当于div.click .yellowbackground-color: yellow;/css样式/大盒子 相当于父级 不会乱跑$(img).hide()$(span:eq(0).click(function()$(img:eq(0).show()$(img:eq(0).siblings().hide()$(this).css(backgroundColor:ye

15、llow)/this方便$(this).siblings().css(backgroundColor:red)/清楚你点了是那个$(span:eq(1).click(function()$(img:eq(1).show()/（）对象是第几个$(img:eq(1).siblings().hide()$(this).css(backgroundColor:yellow)$(this).siblings().css(backgroundColor:red)$(span:eq(2).click(function()$(img:eq(2).show()$(img:eq(2).siblings().hide()$(this).css(backgroundColor:yellow)$(this).siblings().css(backgroundColor:red)$(span:eq(3).click(function()$(img:eq(3).show()$(img:eq(3).sibli