freeCodeCamp-jQuery
来源:互联网 发布:php项目开发实战入门 编辑:程序博客网 时间:2024/05/20 06:52
document ready
- 在HTML最上方加入script元素,其中再加上document ready函数。这个函数的作用是:script里的函数会在浏览器加载了这张网页之后执行,而不是还没加载网页就执行。
<script> $(document).ready(function(){ });</script>
选择HTML元素–使用元素名称
- jQuery总是以$符号开头
- $()中的内容是选择的页面里的html元素名称
- 后面调用的函数是对于选中的元素进行
- addClass函数为元素增加了class
- 注意一句话结束加分号,选择元素加引号
<script> $(document).ready(function() { $("button").addClass("animated bounce"); });</script>
选择HTML元素–使用元素的class
- $(“.classname”)来选择这个class的HTML元素
<script> $(document).ready(function() { $(".well").addClass("animated shake"); });</script>
选择HTML元素–使用元素的id
- $(“#id”)来选择这个id的HTML元素
<script> $(document).ready(function() { $("#target3").addClass("animated fadeOut"); });</script>
jQuery中的function类型
- addClass 为元素添加class
- removeClass 为元素去掉class
- css 为元素修改CSS
- prop 为元素修改属性
- html 为元素里面修改内容(就是选中元素下的所有内容都消失,替换成你新写的内容)
- remove 删掉这个元素的所有内容
- appendTo 把选中的元素移动到另一个元素下
- clone 复制一个元素
- parent 找到这个元素的父元素
- children 找到这个元素的所有子元素
- $(“.target:odd”)选择奇数
- $(“.target:nth-child(3)”)选择第三个
<script> $(document).ready(function() { $("#target1").css("color", "red"); $("#target1").prop("disabled", "true"); $("#target4").html("<em>#target4</em>"); $("#target5").remove(); $("#target2").appendTo("#right-well"); $("#target5").clone().appendTo("#left-well"); $("#target1").parent().css("background-color", "red"); $("#right-well").children().css("color","orange"); $(".target:nth-child(2)").addClass("animated bounce"); $(".target:even").addClass("animated shake"); });</script>
阅读全文
0 0
- freeCodeCamp:jQuery
- freeCodeCamp-jQuery
- 【freecodecamp】jQuery知识点
- Mutations|FreeCodeCamp
- FreeCodeCamp(一)学习笔记
- FreeCodeCamp练习一
- FreeCodeCamp练习二
- 编程学习网freecodecamp
- 关于freecodecamp网站
- [FreeCodeCamp-JavaScript]Basic Algorithm
- [FreeCodeCamp-JavaScript]Intermediate Algorithm
- freeCodeCamp-Basic Algorithm Scripting
- [FreeCodeCamp-Javascript]Advanced Algorithm
- FreeCodeCamp:Truncate a string
- FreeCodeCamp:Seek and Destroy
- freecodecamp Search and Replace
- FreeCodeCamp学习--Chunky Monkey
- FreeCodeCamp学习--Slasher Flick
- 在命令行中使用vs编译器
- Java:输出乘法口诀(上三角)
- Cable master(二分查找)
- 轻量级插件sdstorage用于操作localStorage支持过期、批量搜索删除等
- 动态背景页面登录--(软件实训)
- freeCodeCamp-jQuery
- 编译原理学习笔记·语法分析(LL(1)分析法/算符优先分析法OPG)及例子详解
- 【HDU】1542 Atlantis 矩形面积并->线段树
- HDU-整除的尾数
- Java设计模式
- C++实例 静态成员的引入——静态数据成员的定义、调用,静态成员函数的实现、调用。
- 1042. Shuffling Machine (20)
- HDU 2722 Here We Go(relians) Again
- hive-4