JQUERY知识点整理

属性的值
attr(属性名称，值)-------获取到对象，给某个指定的属性赋值
2）对象的包含的 html 信息： html()----获取到对象的所有子元素对象
Html(值)----将对象原有的子元素内容用值替换
3）class 属性 ：添加 class 值 ：addClass(“class 的名称”) /removeClass（class 的
//表格的各行变色 <style> .class1{
Background-color:red } .class2{
Background-color:blue }
</style> <script>//$(function(){}) $(docuement).ready(function(){
$(“tr:even”).addClass(“class1”); $(“tr:odd”).addClass(“class2”);
//表单验证过程 只能使用 jquery 方法获取元素
3、属性
<input id=”myid” name=”myname” type=”text” class=”mycl”
readyonly=true />
1）标签的属性值 :attr(属性名称) $(“input”).attr(“name”)-------获取到对象的某个
//jquery
1、Jquery------$() 核心函数----进行 Dom 对象与 Jquery 之间的转换 2、选择器：基本选择器： 标签 ID class
如果页面有<input type=”text” id=”mytext” class=”myclass”/> 标签 ：$(“input”) ------------$(document.getElementsByTagName()) ID： $(“#mytext”) ---------- document.getElementById(); Class: $(“.myclass”)
},function(){ $(this).attr(“src”,’1.jpg’);
}) 4）事件
<input type=”button” id=”mybutton” /> Document.getElementById(“mybutton”).onclick=function(){}
//jquery $(“#mybutton”).click(function(){
})
7、工具类 each:对象与数组遍历
Var arr=new Array(“1”,”2”,”3”,”4”,”5”,”6”) //for 遍历 //jquery $.each(arr,function(i,n){
Alert(i+” ”+n);
})
//或是 $(arr).each(function(I,n)){
</tr> <tr>
<td>1</td> <td>1</td> <td>1</td> <td>1</td> </tr>
</table>
//若页面含有<input type=”text” id=”mytext” class=”myclass”/> <input type=”button” id=”mybutton” class=”myclass”/> 获取文本框对象：$(“input[type=’text’]”)或是 $(“:text”)
Alert(i,n); }
或是 $(“input”).Click(fuinction(){
}) 3）事件切换：悬停事件切换 hover(悬停时触发的执行函数,移出是触发的函数)
<img src=”1.jpg”/>//鼠标移入移出改变图片
$(“img”).hover(function(){ $(this).attr(“src”,’2.jpg’);
//给文本框对象赋值 $(“#myid”).val(“文本框”)
//获取文本框对象的值 $(“#myid”).val();
4、文本处理 1）内部插入 append()/appendTo()
$(“<div>”).css({backGroundColor:’green’,width:’100px’}).appendTo(“body”);
2)外部插入：before()/after()
5、关于元素的 Css 样式的操作：css() //给 body 添加背景
$(“body”).css(“background-color”,”red”); 或
$(“body”).css({backGroundColor:”red”})
//<img src=”1.jpg” width=200px/> $(“img”).width()----该函数是针对于 Css 样式的函数
பைடு நூலகம்})
</script> <table>
<tr> <td>1</td> <td>1</td> <td>1</td> <td>1</td>
</tr> <tr>
<td>1</td> <td>1</td> <td>1</td> <td>1</td> </tr>
<tr> <td>1</td> <td>1</td> <td>1</td> <td>1</td>
名称）
4）文本：text()/text(值) <select ></select >
$(“select”).text(“<option>ssss</option>”)----错误示例 //向以下对象中添加相应的值与显示文本
<select > <option ></option>
</select > $(“option”).attr(“value”,1).text(“显示”); 5)值： val()/val(值) <input id=”myid” name=”myname” type=”text” class=”mycl” readyonly=true />
//<img src=”1.jpg” style=”width:200px;height:200px”/> $(“img”).width();
6、事件 1) 页面载入 ready()---------$(document).ready(function(){ })//$(function(){ }) 2)事件处理：bind（）---绑定事件 ----多次执行 one()----只执行一次 <input type=”button” /> //绑定单击事件 click $(“input”).bind(“事件名”,function(){ //事件触发时的处理函数 })