jQuery技术

jQuery常用API jQuery

字号+ 作者:H5之家 来源:H5之家 2017-03-01 15:00 我要评论( )

jQuery常用API jQuery,准备所有jQuery方法都是由$开始的,通常称作为美元符号,或者简称为bling。语法如下script$(document).ready(function(){});/scriptjQuery

准备
所有jQuery方法都是由$开始的,通常称作为 美元符号,或者简称为bling。
语法如下
<script>
$(document).ready(function(){
});
</script>
jQuery 使用选择器获取HTML元素
jQuery通过选择器来选择一个元素的,然后操作元素做些改变。
添加按钮回弹效果
$("button")来选中按钮
用.addClass("animated bounce")给按钮加CSS class。
<script>
$(document).ready(function() {
$("button").addClass("animated bounce");
});
</script>

jQuery使用addClass()方法给元素加class

$(".well").addClass("animated shake");

jQuery根据id属性来获取元素

渐变隐藏效果 $("#target3").addClass("animated fadeOut");

三种选择器

元素选择器:$("button") class选择器:$(".btn") id选择器:$("#target1")

使用jQUery删除HTML元素的class

$("#target2").removeClass("btn-default");

使用jQUery改变HTML元素的css样式

选择器.css(“属性”,”值”); $("#target1").css("color","red");

使用jQUery设置元素不可用

$("#target1").prop("disabled",true);

jQuery使用text()改变文本内容

[emphasize]标签来重写和强调标题文本 .text() 它只能改变文本但不能修改标记 $("#target4").html("#target4");

使用jQuery删除一个html元素

$(#target4).remove();

jQuery使用appendTo()移动html元素

把元素从一个div里移到另外一个div里 $("#target2").appendTo("#right-well");

jQuery使用clone()方法拷贝元素

移动元素就是剪切,拷贝元素就是复制,所以应该就是clone一个,然后移动过去。 $("#target5").clone().appendTo("#left-well");

jQuery使用parent()操作父级元素

$("#target1").parent().css("background-color","red");

jQuery使用children()操作子级元素

$("#right-well").children().css("color","orange");

jQuery使用target:nth-child(n) CSS选择器索引操作元素

:nth-child()按照顺序索引是从1开始的 $(".target:nth-child(2)").addClass("animated bounce");

jQuery使用选择器操作j索引元素

jQuery里的索引是从0开始的 $(".target:even").addClass("animated shake"); $(".target:odd").addClass("animated shake");

使用jQuery修改整个页面

$("body").addClass("animated hinge"); $("body").addClass("animated fadeOut");

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • What’s New In jQuery 3 : 17 Added Features amp; How To Use T

    What’s New In jQuery 3 : 17 Added Features amp; How To Use T

    2017-02-11 18:01

  • jquery源码学习笔记三:jQuery工厂剖析

    jquery源码学习笔记三:jQuery工厂剖析

    2017-01-18 17:03

  • jQuery实现字符串全部替换的方法

    jQuery实现字符串全部替换的方法

    2016-12-15 13:07

  • jQuery 3.0 升级指南

    jQuery 3.0 升级指南

    2016-11-08 16:00

网友点评