原生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. MySql 查询一周内记录

    本周内:select * from wap_content where week(created_at) = week(now) 查询一天:select * from table where to_d ...

  2. swift的String处理

    import UIKit import CoreText class ViewController: UIViewController { override func viewDidLoad() { ...

  3. Kafka在Windows安装运行

    摘要:本文主要说明了如何在Windows安装运行Kafka 一.安装JDK 过程比较简单,这里不做说明. 最后打开cmd输入如下内容,表示安装成功 二.安装zooeleeper 下载安装包:http: ...

  4. SQL 和 NoSQL 比较

    定义: SQL (Structured Query Language) 数据库,指关系型数据库.主要代表:SQL Server,Oracle,MySQL(开源),PostgreSQL(开源). NoS ...

  5. hdu 2066 一个人的旅行 解题报告

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2066 题目意思:给出T条路,和草儿家相邻的城市编号,以及草儿想去的地方的编号.问从草儿家到达草儿想去的 ...

  6. 一步一步学Silverlight 2系列(6):键盘事件处理

    一步一步学Silverlight 2系列(6):键盘事件处理   概述 Silverlight 2 Beta 1版本发布了,无论从Runtime还是Tools都给我们带来了很多的惊喜,如支持框架语言V ...

  7. 小米2在Eclipse 调试,要注意下列步骤。(转)

    小米2在Eclipse 调试,要注意下列步骤.1.连接线,打开设置:USB线连接小米2,在设置-->开发者选项->USB 调是打开.如果这一步,就业在Eclipse中真机调试,下面的步骤不 ...

  8. magento导入数据的方法

    导入演示数据 分两种情况处理. 如果你是用composer方式安装的 非常简单,二行命令搞定:在项目根目录下执行.我们的是在/var/www/magento2/下面. 安装演示数据 php bin/m ...

  9. rcfile

    转自:http://flyingdutchman.iteye.com/blog/1871025 在当前的基于Hadoop系统的数据仓库中,数据存储格式是影响数据仓库性能的一个重要因素.Facebook ...

  10. codeforces 667C C. Reberland Linguistics(dp)

    题目链接: C. Reberland Linguistics time limit per test 1 second memory limit per test 256 megabytes inpu ...