$(根据名字找到某个元素 document代表当前页面).ready这句话相当于加上了一个ready事件，ready的意思是页面加载完成 (function(e)匿名函数{

});

$(document).ready(function(e){});

取元素

JS方式

1.根据ID,取到是DOM对象

var div=document.getElementById("one");

2.根据class,取到的是数组

var div=document.getElementsByClassName("a");

3.根据name,取到的是数组

var div=document.getElementsByName("uid");

4.根据标签名

var div=document.getElementsByTagName("div");

JQUERY方式

在数组中要取DOM对象使用索引的方式,如果取Jquery对象使用eq()

1.根据ID,取到是JQUERY对象,它的索引0是DOM对象

var div=$("#uid");

 

 2.根据class,取到的是数组是JQUERY对象,它的索引0是DOM对象

var div=$(".a")

 

 3.根据属性,取到的是数组

var div=$("[bs='aa']");

4.根据标签名

var div=$("div");

操作内容

JS方式

1.非表单元素

取值

alert(div.innerText);

赋值

div.innerText="你好";

2.表单元素

取值

div.value

赋值

div.value="你好";

JQUERY方式

1.非表单元素

取值

alert(div.text());

赋值

div.text("hello");

2.表单元素

取值

div.val();

赋值

div.val("hello");

操作属性

JS方式

设置、修改属性

div.setAttribute("属性名","属性值");

移除属性

div.removeAttribute("属性名");

获取属性

div.getAttribute("属性名");

JQUERY方式

设置、修改属性

div.attr("a","aa");

移除属性

div.removeattr("a");

获取属性

div.attr("a");

操作样式

JS方式

设置样式

div.style.backgroundColor="blue";

获取样式

alert(div.style.color);//只能获取内联样式

JQUERY方式

设置样式

div.css("background-color","green");

获取样式

alert(div.css("color"));

 

操作元素

var str="
     
";div.append(str);//追加元素$("#abc").remove();//移除

事件

 

click()点击时  dblclick()双击  focus()获得焦点时  blur()失去焦点时  change()选中值变化

mousedown()鼠标按下  mousemove()鼠标移动  mouseout()鼠标离开  mouseover()鼠标放上

$(".b").click(function(){            alert($(this).text());            })

 

bind可以绑定和取消绑定事件

//绑定事件$(".b").bind("click",function(){            alert($(this).text());            });//取消绑定$("#btn").click(function(){            $(".b").unbind("click");            });//添加绑定$("#add").click(function(){            $(".b").bind("click",function(){            alert($(this).text());                    });    });

 

     
      one
     
     
      two
     
     
      three
     
     
      four