一.找元素：

<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");

三.操作属性

　　1.javescript：

a.setAttribute("test","test");

a.removeAttribute("test");

alert(a.getAttribute("value"));

　　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"));

四.操作样式：

　　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);

jquery与javescript的区别（一）的更多相关文章

  1. jQuery.extend和jQuery.fn.extend的区别【转】

    解释的很有意思,清晰明了又有趣,转来分享下,哈哈哈 jQuery.extend和jQuery.fn.extend的区别,其实从这两个办法本身也就可以看出来.很多地方说的也不详细.这里详细说说之间的区别 ...

  2. JQUERY与JS的区别

    JQUERY与JS的区别 <style type="text/css"> #aa { width:200px; height:200px; } </style&g ...

  3. jquery deferred done then区别

    jquery deferred done then区别 deferred是jquery 对promise的实现. 以下内容基于jquery 1.8及以上版本 deferred具有then done等属 ...

  4. jQuery和AngularJS的区别

    这篇文章主要介绍了jQuery和AngularJS的区别浅析,本文着重讲解一个熟悉jQuery开的程序员如何应对AngularJS中的一些编程思想的转变,需要的朋友可以参考下   最近一直在研究ang ...

  5. jQuery和Vue的区别

    1.jQuery和Vue的区别 jQuery是使用选择器($)选取DOM对象,对其进行赋值.取值.事件绑定等操作,其实和原生的HTML的区别只在于可以更方便的选取和操作DOM对象,而数据和界面是在一起 ...

  6. 【Python全栈-JavaScript】JavaScript的window.onload()与jQuery 的ready()的区别

    JavaScript的window.onload()与jQuery 的ready()的区别 做web开发时常用Jquery中$(document).ready()和JavaScript中的window ...

  7. jQuery length 和 size()区别

    jQuery length和size()区别总结如下: 1.length是属性,size()是方法. 2.如果你只是想获取元素的个数,两者效果一样既 $("img").length ...

  8. Jquery ajax, Axios, Fetch区别

    1.   Jquery ajax, Axios, Fetch区别之我见 2.   ajax.axios.fetch之间的详细区别以及优缺点

  9. jQuery与js的区别，并有基本语法详解，

    通过过一下对比,我们能很清楚的发现jquery与js的区别,运用jquery能大量减少代码量,不过js里面关于时间的setinterval和settimeout只能用js <script src ...

随机推荐

  1. int.TryParse非预期执行引发的思考 ASP.NET -- WebForm -- 给图片添加水印标记 Windows -- 使用批处理文件.bat删除旧文件

    int.TryParse非预期执行引发的思考   问题出现 这天在写一个页面,想谨慎些就用了int.TryParse,结果出问题了. 代码如下: Copy int id = 1000; //Reque ...

  2. TeleMCU视频会议系统添加字幕支持

    本文原创自 http://blog.csdn.net/voipmaker  转载注明出处. 最新版本号TeleMCU添加了字幕支持,与会者能够看到其它人的名字,做法是在与会者的视频上overlay 文 ...

  3. 公众号的TOKEN配置PHP代码

    1.在后台添加好URL和TOKEN和生成43位随机码  注意域名URL需要备案 2.上传到服务器 3.公众号后台要点提交即可 error_reporting(0); $signature=$_REQU ...

  4. 动态时间规整-DTW算法

    作者:桂. 时间:2017-05-31  16:17:29 链接:http://www.cnblogs.com/xingshansi/p/6924911.html 前言 动态时间规整(Dynamic ...

  5. CodeMirror与jquery UI-Tabs混合使用 注意事项

    第一步:.将代码高亮渲染 第二步:jquery Tab输出: 第三步:点击Tab切换时,将代码块刷新: 参考:http://jtmorris.net/2013/06/codemirror-editor ...

  6. getconf命令【一天一个命令】

    我们时常需要查询系统相关的信息,比如页面大小,整数大小之类,如果编写程序去计算会比较繁琐,这里有一个很有用的命令,可以用来获取系统相关信息.它就是getconf.   $ getconf PAGE_S ...

  7. 异步FIFO的FPGA实现

    本文大部分内容来自Clifford E. Cummings的<Simulation and Synthesis Techniques for Asynchronous FIFO Design&g ...

  8. linux 下面压缩，解压.rar文件以及rar,unrar实例

    http://www.rarlab.com/download.htm [root@bass src]# wget http://www.rarlab.com/rar/rarlinux-x64-5.4. ...

  9. 今天遇到个PHP不知原因的报内部错误

    今天遇到个PHP不知原因的报内部错误 纠结了很久想尽了办法,1.apache日志 2.错误级别 ,还差点就把自己写的那个破烂不堪的日志系统加上去了 纠结了很久还是无果,在最终,最终发现了 原来是类命名 ...

  10. python学习笔记（10）--爬虫下载煎蛋图片

    说明: 1. 有很多细节需要注意! 2. str是保留字,不要作为变量名 3. 保存为txt报错,encoding=utf-8 4. 403错误,添加headers的方法 5. 正则match只能从开 ...