1.加载DOM区别
JavaScript:
window.onload = first;
window.onload = second;
只会执行第二个window.onload
jQuery:
$(document).ready(function(){
first();
}
$(document).ready(function(){
first();
}
2.获取ID
JavaScript:
document.getElementById("idName")
jQuery:
$("#idName")
3.获取Class
JavaScript:
无明确方法
jQuery:
$(".className")
4.获取元素
JavaScript:
document.getElementsByTagName("tagName")
jQuery:
$("tagName")
5.创建对象并加入文档中
JavaScript:
var elem = document.createElement("p")
document.body.appendElement(elem)
jQuery:
$("div").append("<span>里约奥运</span>")
6.插入元素
JavaScript:
var imgs = document.getElementById('imgs');
var para = document.getElementById('ps');
para.parentNode.insertBefore(imgs,para);
jQuery:
$('<b>Hello!</b>').insertBefore('p');
7.复制节点
JavaScript:
reference = node.cloneNode(deep)//参数true,false决定是否复制子节点
jQuery:
clone(true)//参数true,false决定是否连事件一起复制
8.删除节点
JavaScript:
reference = element.removeChild(node);
jQuery:
remove();
9.属性操作：设置属性节点、查找属性节点
JavaScript:
object.getAttribute(attribute);
object.setAttribute(attribute);
jQuery:
$("p").attr('title');
$("p").attr("title","my title");
10.替换节点
JavaScript:
reference = element.replaceChild(newChild,oldChild)
jQuery:
$("p").replaceWith('<h2>HI</H2>');
11.CSS-DOM操作
JavaScript:
element.style.property
jQuery:
$(selector).css
12.表单赋值
JavaScript:
abc.value = "text";
jQuery:
abc.val("test");
13.改变元素的内容
JavaScript：
abc.innerHTML = "test";
jQuery:
abc.html("test");
14.获得焦点，都是abc.focus();
15.事件绑定
JavaScript:
function test(){
//处理…
}
document.getElementById("but1").onclick=test;
jQuery:
$(“button”).click(function(){//处理…});
16.事件绑定与解除事件绑定
Javascript:
document.getElementById("but1").attachEvent("onclick",test);
document.getElementById("but1").detachEvent("onclick",test);
jQuery:
$("button").bind("click",function(){//处理… });
$("button").unbind("click",function(){//处理… });
$("button").unbind("click");
17.判断某个元素是否存在
JavaScript:
if(document.getElementByIdx_x('but')){}
jQuery:
if($(".classname").length>0){}