jquery学习笔记.doc

$(document).ready()

1)网页中所有DOM结构绘制完毕后就执行,可能DOM元素关联的东西并没有加载完
2)能同时编写多个
$(document).ready(function(){
alert("hello world!");}
);
$(document).ready(function(){
alert("hello again!");}
);
=>简写
$(function(){
…})
DOM(Document Object Model,文档对象模型)
var domObj = (“id”);//获得DOM对象
var ObjHTML = ;//使用Javascript中的方法获得innerHTML
JQuery对象
jQuery 对象就是通过jQuery包装DOM对象后产生的对象
$(”#foo”).html();//获取id为foo的元素内的html代码
==(”foo”).innerHTML;
jQuery对象和DOM对象的相互转换
变量定义风格
var $variable = jQuery对象;
var variable = DOM对象;
jQuery对象----àDOM对象
(1).
jQuery 对象是一个数组对象,可以通过[index]的方法得到相应的dom对象
如:
var $cr = $(”#cr”); //jQuery 对象
var cr =$cr[0]; // DOM对象
alert() //检测这个checkbook 是否被选中了
(2).
通过get(index)方法得到相应的DOM对象
var $cr = $(”#cr”); //jQuery 对象
var cr =$(0); // DOM对象
alert() //检测这个checkbook 是否被选中了
想用的css选择器
E{}
选择器#ID{}
{}
4群组选择器 E1,E2,E3{}
5. 后代选择器 E F {}
* {}
改变id为one的元素的背景色
$(”#one”).css(”background”,”#bbffaa”);
层次选择器
基本过滤选择器
内容过滤选择器:
可见性过滤选择器:
属性过滤选择器:
子元素过滤选择器:
表单对象属性过滤选择器:
表单对象属性过滤示例
jQuery中的DOM操作

var $li=$("ul li:eq(1)");//获取<ul>第二个<li>节点
var li_txt=$();//获取第二个元素节点的文本内容
alert(li_txt);//打印文本内容

attr()方法来获取元素的各种属性值
var $para=$("p");//获取<p>节点
var p_txt=$("title");//获取<p>元素节点属性title
alert(p_txt);//打印title属性值

$(html)方法根据传入的HTML标记字符串,创建一个DOM对象,并将这个对象包装成一个jQuery对象后返回。
var $li_1 = $("<li></li>");//创建第一个<li>元素
var $li_2 = $("<li></li>");
$("ul").append($li_1);//添加的<ul>节点中,使之能在网页中显示
$("ul").append($li_2);

var $li_1 = $("<li>e</li>");//创建第一个<li>元素
var $li_2 = $("<li>f</li>");
$("ul").append($li_1);//添加的<ul>节点中,使之能在网页中显示
$("ul").append($li_2);

var $li_1 = $("<li title='e'>e</li>");//创建第一个<li>元素
var $li_2 = $("<li title='f'>f</li>");
$("ul").append($li_1);//添加的<ul>节点中,使之能在网页中显示
$("ul").append($li_2);

append() appe