前端笔记06-jquery

什么是jquery

Query是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。

jQuery的核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器，并且可对CSS选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器，如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等。

为什么学习jquery

write less do more

• jquery 的html文档加载时的执行函数

---$(function(){}) 函数执行比window.onload事件加载更早---

<script>

window.onload = function(){
alert("1111");
}

window.onload = function(){
alert("22222");
}

// 文档加载完成的事件
// jQuery(document).ready(function(){
// alert("qqq");
// });

// jquery 可以简写成 $
// $(document).ready(function () {
// alert("fffff")
// });

// 最简单的写法
$(function(){
alert("gggggg");
})

</script>

• jquery 的选择器

$("#id")id选择器
$(".class")类选择器
$("标签名")元素选择器
$("*")通配选择器
$("#id1,#id2,.class1,.class2,标签名")组合选择器

• 层级选择器

ancestor descendant后代选择器：选择器1选择器2
parent > child子元素选择器：选择器1>选择器2
prev + next相邻兄弟选择器 找出紧挨着的next元素
prev ~ siblings 找出所有相邻的sibling元素

• 使用JQuery 完成省事联动效果

分析：
1.准备城市数据
2.添加节点：appendChild(js)

• jQ添加节点的方法：

append:添加子元素
appendTo:将自己添加到目标元素
prepend：在在元素前面添加
prependTo(content)
after：在自己的后面添加元素
before(content|fn)

• JQ的遍历