I encountered a slight problem. My jQuery code works as expected in Firefox and Chrome but not in IE11. Not sure why it’s not working.
Here is my HTML, CSS and jQuery:
let nodes = $('h2').contents().filter(function(i, node) {
return node.nodeType === 3;
});
Array.from(nodes).forEach(function(n) {
return n.nodeValue = n.nodeValue.trim();
});h2 img {
width: 31px;
height: 16px;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<h2>This is a test <img class="test" src="https://www.iconsdb.com/icons/preview/red/new-xxl.png" alt="test" /></h2>
<h2>This is another test <img class="test" src="https://www.iconsdb.com/icons/preview/red/new-xxl.png" alt="test" /></h2>
<h2>foo bar <img class="test" src="https://www.iconsdb.com/icons/preview/red/new-xxl.png" alt="test" /></h2>Would like it to work in IE11 as well. Any help is appreciated.
>Solution :
Array.from is not supported in Internet Explorer.
As you use jQuery, just call .each on the nodes collection:
nodes.each(function(_, n) {
n.nodeValue = n.nodeValue.trim();
});