JS — querySelectorAll for IE11/10

blossom0417
1 min readOct 7, 2019

--

chrome and FF works well!

only problem with IE!

  1. IE 11 works fine. but IE10
Array.prototype.slice.call(document.querySelectorAll('.tabConnect li a'))

2. IE11 and IE10 doesn’t work.

document.querySelectorAll('.tabConnect li a')

3. so alternative is just using for not forEach. even const doens’t work for set the variable

var tabEls =  document.querySelectorAll('.tabConnect li a')for (var i = 0; i < tabEls.length; i++) {  if(i === 0 || i === 1){    tabEls[i].style.lineHeight = '2.5';  }tabEls[i].style.height = '38px';}

or

Array.prototype.slice.call()을 써서 object-array-like로 만들어준다. 안그러querySelectorAll은 nodelist이기 때문에 개체가 foreach를 지원하지 않는다고 나온다. 참고로 array.from()은 IE에선 되지 않는다.

var tabEls2 = Array.prototype.slice.call(document.querySelectorAll('.tabConnect li a'))tabEls2.forEach(function(el, idx) {  el.style.height = '38px';});orArray.prototype.slice.call(document.querySelectorAll('.tabConnect li a')).forEach(function(el, idx) {console.log(el)el.style.height = '38px';});

#above IE11, chrome, FF and other latest browsers

Array.prototype.slice.call(document.querySelectorAll('.tabConnect li a')).forEach(function(el, idx) {  if(idx === 0 || idx === 1){  el.style.lineHeight = '2.5';  }  el.style.height = '38px';});

but Foreach has some drawback.

Array.ForEach is about 95% slower than for() in for each for Arrays in JavaScript.

check this out below

https://coderwall.com/p/kvzbpa/don-t-use-array-foreach-use-for-instead

--

--

No responses yet