document.getElementsByTagName遍历复选框

最新推荐文章于 2023-05-24 16:39:32 发布
转载 最新推荐文章于 2023-05-24 16:39:32 发布 · 3.2k 阅读 · 0

本文介绍了如何使用getElementsByTagName方法获取HTML页面中特定类型的元素，通过实例展示了如何获取checkbox的值以及div元素的内容。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

getElementsByTagName：找出相匹配的标签的一个集合并且遍历，下面我们以获取 checkbox多选为实例来介绍。

document.getElementsByTagName(tagname)

说明
getElementsByTagName() 方法返回元素的顺序是它们在文档中的顺序。

核心代码

 代码如下 复制代码

function func(){
var arr = document.getElementsByTagName('input');
var arrValue = [];
var i=0;
for(var n=0;n <arr.length;n++){
   if(arr[n].type=='checkbox' && arr[n].checked){
      arrValue[i++] = arr[n].value;
   }
} 

实例

<!– 获取复选框的值–>

 代码如下 复制代码

<script> 
function func(){ 
 var arr = document.getElementsByName('checkbox'); 
 for(var n=0;n <arr.length;n++){ 
   alert(arr[n].value); 
} 
} 
</script> 
<body> 
<div id="box"> 
<input name="checkbox" id="ch1" type="checkbox" value="aa">aa   
<input name="checkbox" id="ch2" type="checkbox" value="bb" checked>bb 
<input name="checkbox" id="ch3" type="checkbox" value="cc" checked>cc 
<input name="checkbox" id="ch4" type="checkbox" value="dd">dd 
</div> 
<input type="button" value="check" onClick="func()"> 
</body> 
</html>

同时还可以获取 div元素

 代码如下 复制代码

<span id="aa">11</span>
<span id="aa1">22</span>
<span id="aa2">33</span>

<script>
var pp = document.getElementsByTagName("span");
for(i=0;i<pp.length;i++){
   alert(pp[i].innerHTML);
}
</script>  

用getElementsByTagName遍历HTML DOM元素
左直拳的马桶_日用桶
03-02 9492
<br />var eles = document.getElementsByTagName("div");<br />     for (var i = 0; i < eles.length; i++) {<br />         if (eles[i].id.indexOf("ddd_") != -1) {<br />             alert("找到div：" + eles[i].id);<br />         }<br />     }
jquery 获取标签名(tagName)
weixin_30855761的博客
08-14 181
如果是为了取到tagName后再进行判断，那直接用下面的代码会更方便： $(element).is('input') 如果是要取到标签用作到别的地方，可以使用一下代码： $(element)[0].tagName 或： $(element).get(0).tagName 转载于:https://www.cnblogs.com/youring2/archive/2012/0...
通过document.getElementsByName来实现 复选框的全选，全部选，反选
z . s . j
03-04 6458
function selectall() {  for(i=0;i  {  document.getElementsByName("a")[i].checked = "checked";  } } function selectno() {  for(i=0;i  {  document.getElementsByName("a")[i].checked = false;
关于getElementsByTagName的遍历顺序
weixin_34202952的博客
08-26 764
关于getElementsByTagName的遍历顺序是怎么样的呢？ getElementsByTagName的遍历顺序是从HTML的页面从上到下遍历还是按照标签的嵌套顺序层层遍历的呢？ 来做个小小的测试？ 看代码！ <body> <div> <div> <p>2</p> ...
document.all还是document.getElementsByName?
KimYoo的专栏
11-15 2732
当页面上的控件同名且多个的时候,你首先做的是什么?判断长度?的确,从程序的严密角度出发,我们是需要判断长度,而且有长度和没长度是两种引用方法.我们来看:oEle= document.all.aaa ;//这里有一个aaa的对象,但我们不知道它现在长度是多少,所以没办法对它操作.因此,我们要先做判断长度的过程.如下:if(oEle.length){}else{};在两种情况下,花括号里面的内容写法也
document.all与getElementById、getElementsByName、getElementsByTagName用法区别-getElementById
09-06
通常用于查找具有相同`name`属性的表单元素，例如多个复选框或单选按钮。由于`name`属性可以重复，`getElementsByName()`可能返回多个元素。在所有现代浏览器中，它只根据`name`属性进行查找。 4. `...
document.all与getElementById、getElementsByName、getElementsByTagName用法区别-document.all第1/2页
09-06
这将获取所有name为'docname'的元素，可能包含多个元素，因为name属性可以用于表单元素的复选框或 radio 按钮等，允许多个元素有相同的name值。 4. `getElementsByTagName` `getElementsByTagName` 方法根据元素...
javascript 设置某DIV区域内的checkbox复选框
10-29
在Web开发中，经常需要对页面上的复选框（checkbox）进行控制，比如实现全选或全不选的功能。当页面上有多个div区域，每个区域中又包含若干复选框时，如果要控制每个区域内复选框的选中状态，就可以利用JavaScript的...
javascript中DOM复选框选择用法实例
10-24
`reverseAll`函数同样遍历`checkboxs`数组，对每个复选框执行一个检查操作：如果复选框当前是选中状态（`checked`属性为`true`），则将其改为未选中状态（`checked`属性为`false`），反之亦然。这样就实现了反选的...
javascript实现选中复选框后相关输入框变灰不可用的方法
12-11
接着，函数遍历`container`内的所有输入框（`<input>`元素），使用`getElementsByTagName`方法获取它们，并根据复选框的选中状态（`checked`属性）设置输入框的`disabled`属性。如果复选框被选中，则输入框变为灰色...
document.getElementsByTagName
nox
04-05 578
document.getElementsByTagName获取到的是HTMLCollection对象，for in遍历的是所有属性，不是只针对数组下标而已。HTMLCollection还包含了length，item，nameItem属性和选出的html对象（firefox），其他浏览器可能不支持nameItem和item属性（如ie8-）
getElementsBayTagName获取数组foreach遍历报错
Dirloveme的博客
05-24 573
问题 1：getElementsByTagName获取的是类数组 调用forEach需要转换成Array 数组。需求：获取Editorimg下的img元素数组，通过遍历转换数据。通过解构将类数组转换成正常数组，就可以正常使用forEach遍历了。问题 2：本地运行成功但打包后它运行时失败。
javaweb---------------document常见方法 document.getelementsbyname和document.getelementsbytagname
tutou_girl的博客
01-16 411
document.getelementsbyname document.getelementsbytagname
DOM-2 【document对象-遍历节点元素树】
Yesterday_Tomorrow的博客
11-16 416
一.document对象 (1).拥有方法 document.getElementById('box') //在IE8及以下是不分大小写的，而且name值也能匹配上 document.getElementsByClassName('') //IE8及以下是用不了的 document.getElementsByTagName() 都兼容 document.getElementsByName() 用的非常少 (2).备注 id(钩子)：能不用就不用，模块化开发id只用于后端注入数据 除去ge..
【JavaScript 进阶之旅 DOM篇 第二章】document对象、获取元素、节点、遍历树
马云
06-05 653
HTML5 新引入的WEB API 三、遍历节点树 节点包含元素（元素节点树）
js中遍历元素的方法
ruler1112的博客
01-19 7081
在js中遍历元素有许多方法，下面介绍几种比较方便的方法 1.使用深度优先或者广度优先遍历(这个方法很麻烦，但是很有效，虽然它的性能不是很高)，具体可以看数据结构 2.使用document.getElementByTagName(“*”)方法，以通配符“*”作为参数获取所有元素，下面就简单了，一个for循环遍历就可以找到你要的元素了。 3.使用DOM2级自带的方法document.create
document.getElementsByTagName函数
weixin_30639719的博客
11-27 1087
<html> 　　<head> 　　　　<script type="text/javascript"> 　　　　<!-- 　　　　　　//1、当整个HTML文档完全加载成功后触发window.onload事件。 　　　　　　//2、事件触发时，执行后面function里边的函数体。 　　　　　　window.onload = functio...
java getelementsbytagname 不全,java – getElementsByTagName不起作用
weixin_34923040的博客
03-13 340
我有下一个简单的代码部分：String test = "9145b1d3-4aa3-4797-b65f-9f5e00be1a30"DocumentBuilderFactory dbf = DocumentBuilderFactory.newInstance();Document doc = dbf.newDocumentBuilder().parse(new InputSource(new Str...
个人js学习细节 - getElementsByTagName获取某类元素及遍历实现点击切换文字
luckybuling
07-28 2816
&lt;script&gt; window.onload = function () { //getElementsByTagName这里获取的是li的全部元素同时放在数组lis，存储获取的所有li var lis = document.getElementsByTagName("li"); //getElem...
实现网页多复选框全选与反选的JavaScript技术
在JavaScript中，可以使用`document.querySelectorAll`或者`document.getElementsByTagName`方法获取页面上所有的复选框元素。一般使用`document.querySelectorAll('input[type="checkbox"]')`来选取页面上所有的复...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值