元素选择器

元素选择器:根据给定(html)标记名称选择所有的元素

表示方式为:$( “element” )

搜索指定元素标签名的所有节点,这个是一个合集的操作。同样的也有原生方法getElementsByTagName()函数支持

下面编辑器代码使用两种方式获取并设置CSS属性:

<!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="http://libs.baidu.com/jquery/1.9.1/jquery.min.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">//通过原生方法处理//获取到所有的节点标记名为div的元素//给每一个div加上蓝色的边框var divs = document.getElementsByTagName('div');for (var i = 0; i < divs.length; i++) {divs[i].style.border = "3px solid blue";}</script><script type="text/javascript">//通过jQuery直接传入标签名p//标签是可以多个的,所以得到的同样也是一个集合$("div").css("border", "3px solid red");</script>
</body></html>

第一组:通过getElementsByTagName方法得到页面所有的

元素
var divs = document.getElementsByTagName(‘div’);

divs是dom合集对象,通过循环给每一个集合中的div元素赋予新的boder样式

第二组:同样的效果,$(“div”)选取所有的div元素,通过css方法直接赋予样式

JQuery中的元素选择器相关推荐

  1. jQuery框架学习第二天:jQuery中万能的选择器

    jQuery框架学习第一天:开始认识jQuery jQuery框架学习第二天:jQuery中万能的选择器 jQuery框架学习第三天:如何管理jQuery包装集 jQuery框架学习第四天:使用jQu ...

  2. 网页加载的不同的方式、点击按钮显示一句话、jQuery中获取元素的方法

    网页加载的不同的方式 <!DOCTYPE html> <html lang="en"> <head><meta charset=" ...

  3. 【jQuery 教程系列第 10 篇】jQuery 中的过滤选择器(基本筛选器)

    这是[jQuery 教程系列第 10 篇],如果觉得有用的话,欢迎关注专栏. jQuery 中除了一些 基本选择器 ,也有一些过滤选择器,本篇博客仅挑选其中的几个简单说明一下,其它的大家可以点击 jQ ...

  4. jquery中删除元素的remove()方法

    今天看jquery中删除元素的方法,包括remove()方法和empty() 方法 remove()方法为删除被选元素及子元素 empty() 方法为删除元素中的子元素 其中remove()方法还有一 ...

  5. jQuery中的基本选择器,id,class,元素,通用

    常用的基本选择器: 后续的补充选择器 为了后面看的方便,我们先将body中的内容展示出来: <body><p>账号:<input type="text" ...

  6. JQuery中的id选择器含有特殊字符时,不能选中dom元素的解决方法

    1.jquery类库在我们实际项目中用的很多,大家经常需要根据控件的id,获取对应的html元素.但是:当id含有特殊字符的时候,是不能选中的. 2.自己简单的测试了下,jquery的id选择器只支持 ...

  7. JQuery中的层级选择器

    层级选择器 文档中的所有的节点之间都是有这样或者那样的关系.我们可以把节点之间的关系可以用传统的家族关系来描述,可以把文档树当作一个家谱,那么节点与节点直接就会存在父子,兄弟,祖孙的关系了. 选择器中 ...

  8. JQuery中的全选择器(通配符)

    全选择器(*选择器) 在CSS中,经常会在第一行写下这样一段样式 * {padding: 0; margin: 0;} 通配符*意味着给所有的元素设置默认的边距.jQuery中我们也可以通过传递*选择 ...

  9. jquery 中多条件选择器,相对选择器,层次选择器的区别

    一.Jquery常用的过滤选择器如下所示: 1.:first,选取第一个元素,比如$("div:first")选取第一个div元素 2.:last,选取最后一个元素,比如$(&qu ...

最新文章

  1. 登录linux后台工具,linux后台进程管理工具-supervisor
  2. Linux常用命令汇总(持续更新中)
  3. seaJs api 帮助文档
  4. 【集合论】序关系 ( 偏序集元素之间的关系 | 可比 | 严格小于 | 覆盖 | 哈斯图 )
  5. linux pread/pwrite
  6. e - bargain cf_cf诗意情侣名字大全最新_cf诗意情侣名字大全2020
  7. Python-OpenCV-- 台式机外接摄像头EAST文本检测+OCR识别
  8. cad渐变线怎么画_怎么画压力线和支撑线
  9. LeetCode 463. Island Perimeter
  10. Sublime Text 使用介绍、全套快捷键及插件推荐
  11. 上楼梯算法的java实现(转)
  12. 前端与游戏前端unityUI比较
  13. 交互软件Axure—高保真原型
  14. net反编译工具Reflector下载
  15. Unity3d C# Socket 下载文件 (同步到)
  16. vyos -vyatta-config-commit save
  17. 智能数据中心和智慧园区:华为的单点突破与全局效应
  18. 使用 Nginx 服务器配置 flv、mp4,可以直接浏览器播放
  19. [HNOI2003]激光炸弹(二维前缀和+大坑点)
  20. 信息系统项目管理师第四版(最新)重点(背诵)内容概览

热门文章

  1. python科学计算笔记(十三)pandas的merge、concat合并数据集
  2. Scrapy匹配xpath时tbody标签的问题
  3. linux解决病毒系列之一,删除十字符libudev.so病毒文件
  4. 17个服务器发展趋势,我们都给您总结好了!
  5. 10.15 iptables filter表小案例10.16/10.17/10.18 iptables nat表应用
  6. tomcat日志按天切分
  7. aardio学习笔记-变量与常量
  8. openstack 安装
  9. php编译参数注解--不明白许多参数的作用 慎用 –with-curlwrappers参数
  10. 使用T-SQL配置数据库事务日志传送