This article describes how to use tagname and id to obtain elements in js, including three methods, for more information about how to use tagname and id to obtain elements in Javascript, see the following.
Method 1: Integral MethodFirst, obtain all the elements, and then use the ai +-B method to calculate the required elements.
Method 2: Array MethodCreates an empty array in the global environment. When a loop structure is required, the elements are obtained in the loop and placed into the array.
Method 3: Function MethodWhen encountering the same group of elements, only one group of elements is operated, and all the effects are achieved by passing parameters using the function.
The Code is as follows:
Three methods to obtain elements using tagname and idCategory name
- Save Cancel
- Save Cancel
- Save Cancel
Script // [1] overall method. Obtain all elements first, and then use the ai +-B method to calculate the required element var oList = document. getElementById ('box-list'); var aInput = oList. getElementsByTagName ('input'); var aBtn = oList. getElementsByTagName ('click'); for (var I = 0; I <aBtn. length; I ++) {aBtn [I]. index = I ;}for (var I = 0; I <aInput. length; I ++) {// confirm the button aBtn [2 * I]. onclick = function () {aInput [this. index/2]. disabled = true;} // cancel the button aBtn [2 * I + 1]. onclick = function () {aInput [(this. index-1)/2]. disabled = false; aInput [(this. index-1)/2]. value = ''; console. log (1) ;}/// [2] array method. An empty array is created in the global environment. When a loop structure is required, elements are obtained in the loop, and put the array var oList = document. getElementById ('box-list'); var aIn = oList. getElementsByTagName ('lil'); var aInput = []; var aBtnY = []; var aBtnX = []; for (var I = 0; I <aIn. length; I ++) {aInput [I] = aIn [I]. getElementsByTagName ('input') [0]; aBtnY [I] = aIn [I]. getElementsByTagName ('button ') [0]; aBtnX [I] = aIn [I]. getElementsByTagName ('button ') [1]; aBtnY [I]. index = aBtnX [I]. index = I; // click the OK button aBtnY [I]. onclick = function () {aInput [this. index]. disabled = true;} // cancel the button aBtnX [I]. onclick = function () {aInput [this. index]. disabled = false; aInput [this. index]. value = ''; console. log (2) ;}/// [3] function method. When several identical elements are encountered, only one group of elements is operated, use the function to pass parameters to achieve all the effects var oList = document. getElementById ('box-list'); var aIn = oList. getElementsByTagName ('lil'); function fn (I) {var oInput = aIn [I]. getElementsByTagName ('input') [0]; var oBtnY = aIn [I]. getElementsByTagName ('button ') [0]; var oBtnX = aIn [I]. getElementsByTagName ('button ') [1]; // confirm the button oBtnY. onclick = function () {oInput. disabled = true;} // cancel the button oBtnX. onclick = function () {oInput. disabled = false; oInput. value = ''; console. log (3) ;}}for (var I = 0; I <aIn. length; I ++) {fn (I);} script
I hope this article will help you learn how to get elements from js.
