使用id名称和name直接获取元素
我们知道一些第三方的js库对如何快速选取html中的元素做了一些简化,貌似十分高深莫测,其实也不然。而且js本身自带了对于特殊元素的简便选取的方法,下面就为大家简单介绍下。
在html中,一般最直接的辨别html元素使用的是name和id属性,两者有着细微的不同:id必须页面唯一,但name可以有重复。
在js中如果id名称不和内置属性或全局变量重名的话,该名称自动成为window对象的属性
<div id="demo"></div>
test.onclick = function(){
//your code
}
等价于
window.test.onclick = function(){
//your code
}
对于name属性来说,只有某些类型的html元素具有类似的方法,比如:form,img,iframe,applet,embed,object等。在这些元素中可以通过全局变量或者document的属性来访问特定name属性的元素;如果相同name属性的有多个元素,则返回一个NodeList的类似只读数组的对象,例如如下代码:
<div> <img name="pic" src="#" alt="pic_0" /> <img name="pic" src="#" alt="pic_1" /> <img name="pic" src="#" alt="pic_2" /></div>//我们可以这样引用name为pic的元素:for(x in pic) console.log(pic[x].alt);使用id名称和name直接获取元素的更多相关文章
- iframe父页面和子页面获取元素和js变量
父页面获取iframe页面元素和变量 获取方法:$("#id")[0].contentWindow.showInfo(): 获取元素: $("#id").co ...
- 从零开始学 Web 之 DOM(二)对样式的操作,获取元素的方式
大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程.此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注.在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识 ...
- WebBrowser网页操作之提取获取元素和标签(完整篇)
最近使用WebBrower做了几个Hook小程序,收集积累如下: using System; using System.Collections.Generic; using System.Linq; ...
- js中用tagname和id获取元素的3种方法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JavaScript通过元素id和name直接获取元素的方法
概览: 偶然的机会,我在JavaScript中直接用HTML元素的id属性来获取该元素,并设置该元素的其他属性值,竟然能够正确解析不报错!于是我去查阅相关资料,也有其他同行这么用. 虽然说这种用法不是 ...
- 不获取元素,直接使用id操作dom元素
今天无意中发现个让我很吃惊的问题. 不使用getElementById方法,也可以用id直接操作有id的元素. 继续搜索后,发现name也可以直接操作... 这让我大感意外,了解以后,忍不住写点东西记 ...
- JavaScript通过ID获取元素坐标
JavaScript通过ID获取元素坐标 function getElementPos(elementId) { var ua = navigator.userAgent.toLowerCase ...
- jquery通过name,id名称获取当前value值
name是input标签的属性值,jQuery提供了attr() 方法用于设置/改变属性值 $("input:text").attr("name");$(&qu ...
- 根据id设置、获取元素的文本和value
/** * 根据id获取元素文本 * @param {String} id|元素id * return {Integer || String} text */function getText(id){ ...
随机推荐
- Struts2:MyEclippse中使用struts-default.xml中定义的拦截器(timmer,logger)
环境:MyEclipse 2015 Stable 2.0:struts2-core-2.3.16.1.jar等 struts.xml <struts> <package name=& ...
- IOS 中openGL使用教程3(openGL ES 入门篇 | 纹理贴图(texture)使用)
在这篇文章中,我们将学习如何在openGL中使用纹理贴图. penGL中纹理可以分为1D,2D和3D纹理,我们在绑定纹理对象的时候需要指定纹理的种类.由于本文将以一张图片为例,因此我们为我们的纹理对象 ...
- DataURL详解--转自格桑blog
DataURI详解 Posted on 2013 年 09 月 09 日 by admin DataURI,不算新东西,却一直没用过,前些日子在webapp中用了点DataURI,就做了下相关的了解, ...
- ios 设置声音和震动,单独控制
一.今天项目中涉及了设置这快的声音震动和响铃,搞的头大,以前搞过,只是简单的调用系统的方法就可以实现,但是现在的公司要求,震动是震动,响铃是响铃,我看了微信,微信也是的分开的,做的很好,但是我就纳闷了 ...
- python3+ 模块学习 之 subprocess
subprocess 模块方法: call() check_call() check_output() 以上三个方法用于创建一个子进程,父进程等待子进程结束.若shell = true, 则shell ...
- java.lang.IllegalArgumentException: template not initialized; call afterPropertiesSet() before using
在使用spring-data-redis时使用junit测试报错: java.lang.IllegalArgumentException: template not initialized; call ...
- chrome livestyle插件
1.sublime 安装 >step1: ctrl+shift+p >step2:ip >step3:livestyle >step4:配置ho ...
- Spark Streaming中动态Batch Size实现初探
本期内容 : BatchDuration与 Process Time 动态Batch Size Spark Streaming中有很多算子,是否每一个算子都是预期中的类似线性规律的时间消耗呢? 例如: ...
- IAR调节字体大小
在主面板上点击tools->Options,然后点开Editor,选择下面的Colors and Fonts选项,最后选右上方的Font,选择要设置的字体就OK了.
- idea 显示行号
File->Settings->Editor->General->Appearence->Show Line Number 选中之后"Apply",然 ...