jQuery

front end

  • 添加document ready function
<script> $(document).ready(function() { }); </script>

::在没有document ready function以前,你的代码会在HTML没有渲染完成就执行,这样会产生bug。::

  • 所有jQuery方法都是由$开始的,通过选择器来选择一个元素,然后操作元素做些改变。
//给所有按钮元素添加弹跳效果
$(document).ready(function() {
    $("button").addClass("animated bounce");
  });
  • 你只需要用jQuery的.addClass()方法,就可以给元素加class了。

  • 使用$(“.well”)来获取所有class为well的div元素。

  • 用$(“#”)来选择id为target3的button元素。

  • jQuery有一个.prop()的方法让你来调整元素的属性。

//我们是这样来让按钮不可选的:
$("button").prop("disabled", true);
  • jQuery有一个叫做.css()的方法能让你改变元素的CSS样式。
//我们是这样来把颜色改变成蓝色的:
$("#target1").css("color", "blue");
  • jQuery的.html()方法可以添加HTML标签和文字到元素,而元素之前的内容都会被方法的内容所替换掉。
    1. 我们是通过em[emphasize]标签来重写和强调标题文本的:(改变标签)
//使#target4文本变成斜体
$("#target4").html("<em>#target4</em>");
  1. .text(),它只能改变文本但不能修改标记。
//使#target4的文本变成<em>#target4</em>
$("#target4").text("<em>#target4</em>");
  • jQuery 有一个.remove() 的方法可以移除HTML元素。

::超赞!::

  • 你想让target4从我们的从right-well移到left-well,我们可以这样使用:
//这个方法相当于剪切+粘贴
$("#target4").appendTo("#left-well");
  • jQuery的clone()方法可以拷贝元素。
//如果我想把target2从left-well拷贝到right-well,我们可以这样写:
$("#target2").clone().appendTo("#right-well");
  • jQuery有一个方法叫parent(),它允许你访问指定元素的父元素。
//让left-well 元素的父元素parent()的背景色变成蓝色。
$("#left-well").parent().css("background-color", "blue”);
  • jQuery有一个方法叫children(),它允许你访问指定元素的子元素。

  • jQuery 用CSS选择器来选取元素,target:nth-child(n) CSS选择器允许你按照索引顺序(从1开始)选择目标元素的所有子元素。

//给目标元素的第三个子元素添加bounce class。
$(".target:nth-child(3)").addClass("animated bounce");
  • 选择奇数偶数元素:
    ::jQuery里的索引是从0开始的,也就是说::odd 选择第2、4、6个元素,::
    ::而:even选择第1、3、5、7个元素!::
//like this
$(".target:even").addClass("animated shake");
全部评论

相关推荐

屌丝逆袭咸鱼计划:心态摆好,man,晚点找早点找到最后都是为了提升自己好进正职,努力提升自己才是最关键的😤难道说现在找不到找的太晚了就炸了可以鸡鸡了吗😤早实习晚实习不都是为了以后多积累,大四学长有的秋招进的也不妨碍有的春招进,人生就这样
点赞 评论 收藏
分享
05-21 15:47
门头沟学院 Java
浪漫主义的虹夏:项目有亮点吗,第一个不是纯玩具项目吗,项目亮点里类似ThreadLocal,Redis储存说难听点是花几十分钟绝大部分人都能学会,第二个轮子项目也没体现出设计和技术,想实习先沉淀,好高骛远的自嗨只会害了自己
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务