jquery与javescript的区别（一）

一.找元素：

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script src="jquery-1.11.2.min.js"></script><style type="text/css">#aa{ width:100px; height:100px;}</style></head><body><div id="aa" style="color:red"><span>aaaaaa</span></div><div class="a1">div1</div><div class="a1">div2</div><span class="a1" bs="1">span1</span><input type="text" name="uid" id="bd" value="aa" /><input type="checkbox" id="ck" /> 全选<br /><br /><input type="checkbox" class="ck" /><input type="checkbox" class="ck" /><input type="checkbox" class="ck" /><input type="checkbox" class="ck" /><input type="checkbox" class="ck" /></body></html>

　　1.id

　　　　　　javescript：var a = document.getElementById("aa");

　　　　　　jquery： var a = $("#aa");

　　2.class

　　　　　　javescript：var a = document.getElementsByClassName("a1");

　　　　　　jquery：　　var a = $(".a1");

　　3.name

　　　　　　javescript：var a = document.getElementsByName("uid");

　　　　　　jquery: 　没有专门的方法

　　　　　　　　　　　　var a = $("div");

　　　　　　　　　　　　var a = $("[bs=1]");

二.操作内容：

　　1.javescript：

//非标单元素  alert(a.innerText); //文本  alert(a.innerHTML); //HTML代码//表单元素  alert(a.value);  a.value="hello";

　　2.jquery:

//非表单元素  alert(a.text());  a.text("bbbbb");  alert(a.html());//表单元素 a.val("hello");

View Code

三.操作属性

　　1.javescript：

a.setAttribute("test","test");a.removeAttribute("test");alert(a.getAttribute("value"));

View Code

　　2.jquery:

a.attr("test","test");a.removeAttr("test");alert(a.attr("value"));a.prop("test","test");a.removeProp("test");alert(a.prop("test"));a.prop("checked",true);alert(a.prop("checked"));

View Code

四.操作样式：

　　1.javescript：

a.style.fontSize = "30px";alert(a.style.color);

　　2.jquery:

a.css("background-color","green");alert(a.css("width"));

五.统一操作：

　　1.javescript：

var d = document.getElementsByClassName("a1");for(var i=0;i<d.length;i++){    d[i].style.fontSize = "30px";}

　　2.jquery:

$(".a1").css("font-size","30px");$(".ck").prop("checked",true);

文章转载于:https://www.cnblogs.com/shenzikun1314/p/6531086.html

原著是一个有趣的人,若有侵权,请通知删除

本博客所有文章如无特别注明均为原创。
复制或转载请以超链接形式注明转自起风了，原文地址《jquery与javescript的区别（一）》