原生JS

var elements1 = document.getElementsByTagName('*');

JQ

 var elements2 = $("*");

  

<!DOCTYPE html>
<html> <head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title></title>
<style>
div {
width: 100px;
height: 90px;
float: left;
padding: 5px;
margin: 5px;
background-color: #EEEEEE;
}
</style>
<script src="https://www.imooc.com/static/lib/jquery/1.9.1/jquery.js"></script>
</head>
<body>
<div class="aaron">
<p>class="aaron"</p>
<p>选中</p>
</div>
<div class="aaron">
<p>class="aaron"</p>
<p>选中</p>
</div>
<div class="imooc">
<p>class="imooc"</p>
<p>jQuery选中</p>
</div>
<div class="imooc">
<p>class="imooc"</p>
<p>jQuery选中</p>
</div> <script type="text/javascript">
//获取页面中所有的元素
var elements1 = document.getElementsByTagName('*');
</script>
<script type="text/javascript">
//获取页面中所有的元素
var elements2 = $("*");
//原生与jQuery方法比较
//===表示数据和类型都相等
if(elements2.length === elements1.length){
elements2.css("border","1px solid red");
}
</script>
</body> </html>

  

兼容性问题:

  1. IE会将注释节点实现为元素,所以在IE中调用getElementsByTagName里面会包含注释节点,这个通常是不应该的
  2. getElementById的参数在IE8及较低的版本不区分大小写
  3. IE7及较低的版本中,表单元素中,如果表单A的name属性名用了另一个元素B的ID名并且A在B之前,那么getElementById会选中A
  4. IE8及较低的版本,浏览器不支持getElementsByClassName

Jquery | 基础 | 慕课网 | (*选择器)的更多相关文章

  1. Jquery | 基础 | 慕课网 | 基本筛选选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  2. Jquery | 基础 | 慕课网 | 层级选择器

    选择器中的层级选择器处理关系类型: 子元素 后代元素 兄弟元素 相邻元素 <!DOCTYPE html> <html> <head> <meta http-e ...

  3. Jquery | 基础 | 慕课网 | 类选择器

    原生getElementsByClassName()函数的实现代码与jQuery实现代码的比较: <!DOCTYPE html> <html> <head> < ...

  4. Jquery | 基础 | 慕课网 | 元素选择器

    getElementsByTagName方法得到页面所有的<div>元素 var divs = document.getElementsByTagName('div'); 与 同样的效果, ...

  5. Jquery | 基础 | 属性过滤选择器

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. JQuery 基础之基本选择器

    1.什么是jQuery选择器: jQuery选择器继承了CSS与Path语言的部分语法,允许通过标签名.属性名或内容对DOM元素进行快速.准确的选择,而不必担心浏览器的兼容性,通过jQuery选择器对 ...

  7. 慕课网4-2 编程练习:jQuery祖先后代选择器小案例

    4-2 编程练习 结合所学的祖先后代选择器,实现如下图所示效果 任务 (1)使用祖先后代选择器将第二段文字背景色变成红色 (2)使用jQuery的.css()方法设置样式,语法css('属性 '属性值 ...

  8. es6 Object.assign ECMAScript 6 笔记(六) ECMAScript 6 笔记(一) react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式

    es6 Object.assign   目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...

  9. 10慕课网《进击Node.js基础(一)》初识promise

    首先用最简单的方式实现一个动画效果 <!doctype> <html> <head> <title>Promise animation</titl ...

随机推荐

  1. poj3253 Fence Repair【哈夫曼树+优先队列】

    Description Farmer John wants to repair a small length of the fence around the pasture. He measures ...

  2. Linux和Windows设备驱动架构比较

    毕业后一直在学操作系统, 有时候觉得什么都懂了,有时候又觉得好像什么都不懂,但总体来说自认为对操作系统实现机制的了解比周围的人还是要多一些.去年曾花了几个星期的晚上时间断断续续翻译了这篇对Linux和 ...

  3. PHP琐碎学习

    在子类中如果定义了__construct则不会调用父类的__construct,如果需要同时调用父类的构造函数,需要使用parent::__construct()显式的调用. class Car { ...

  4. Android_Service详解及实例

    转自:http://blog.csdn.net/guolin_blog/article/details/11952435    http://blog.csdn.net/guolin_blog/art ...

  5. aop中获取方法的注解

    @Around(value="@annotation(apiLog)") public Object around(ProceedingJoinPoint pjp, ApiLog ...

  6. A JavaScript library for reading EXIF meta data from image files.

    exif-js/exif-js: JavaScript library for reading EXIF image metadata https://github.com/exif-js/exif- ...

  7. Mongoose Embedded Web Server Library

    https://github.com/cesanta/mongoose http://ltp.ai/docs/ltpserver.html LTP Server在轻量级服务器程序mongoose基础上 ...

  8. Ruby map、each、select、inject、collect 、detect reference

    参考 https://ruby-china.org/topics/26718 map:(collect是map的别名函数) 对数组中每个元素进行表达式操作,原始数组不会被改变,返回执行表达式结果的新数 ...

  9. atexit函数的使用【学习笔记】

    #include "apue.h" static void my_exit1(void); static void my_exit2(void); int main(void) { ...

  10. WebSocket使用教程 - 带完整实例--网址:https://my.oschina.net/u/1266171/blog/357488

    什么是WebSocket?看过html5的同学都知道,WebSocket protocol 是HTML5一种新的协议.它是实现了浏览器与服务器全双工通信(full-duplex).HTML5定义了We ...