您的位置:首页 > Web前端 > JQuery

jQuery常用API

2017-02-21 18:03 357 查看
准备

所有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()改变文本内容

<em></em>
[emphasize]标签来重写和强调标题文本

.text()
它只能改变文本但不能修改标记

$("#target4").html("<em>#target4</em>");


使用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");
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: