CODEWITHSUNDEEP
javascriptjqueryhtmlcss.net
user2147163
user2147163

Reputation: 87

javascript Filter function is not working in IE 11 but working fine in Chrome and Mozilla

Filter function is not working in IE 11 Edge but its working fine in Chrome and Mozilla .I am working on below code

var data = $(".chartsValue text");

var filteredData=data.filter(function()
 { return $(this).css('font-weight') == 'bold';
 }).text();

I am getting the value in html like below

<g class="chartsValue" style="cursor:pointer;text-align:center;" transform="translate(101,10)">
<rect x="0" y="0" width="19" height="16" strokeWidth="0" fill="none" rx="0" ry="0">
</rect>
<text x="0.828125" zIndex="1" style="font-size:11;font-weight:bold;color:black;fill:black;" y="14">
6m
</text>

So, I need to fetch 6m value through style in IE Edge too

Upvotes: 0

Views: 10868

Answers (3)

user2147163
user2147163

Reputation: 87

Thanks Guys for the quick response I solved this problem by using attribute property

var filteredData =data.filter(function()
{
    return $(this).attr('style').indexOf('bold') > -1;
}).text();

Upvotes: 2

DaftKauries
DaftKauries

Reputation: 46

jQuery's .filter(function) returns a subset of elements based on your function. If you want to access the first element in the resulting subset you should use .first() e.g.:

var data = $(".chartsValue text");

var filteredData = data.filter(function () {
    return $(this).css("font-weight") === "bold";
}).first().text();

If there are multiple elements in the resulting subset you can use .map(function) e.g.:

var data = $(".chartsValue text");

var filteredData = data.filter(function () {
    return $(this).css("font-weight") === "bold";
}).map(function () {
    return $(this).text();
});

You might also want to trim the text you get back using String.trim() e.g.: .text().trim();

Upvotes: 1

Egor Stambakio
Egor Stambakio

Reputation: 18146

Actually, we can extract a filter function and iterate even through NodeList type with pure JavaScript: 

const els = document.querySelectorAll('g.chartsValue text');

const filter = fn => x => Array.prototype.filter.call(x, fn);

const r = filter(e => e.style['font-weight'] === 'bold')(els).map(x => x.innerText)

console.log(r)
<g class="chartsValue" style="cursor:pointer;text-align:center;" transform="translate(101,10)">
<rect x="0" y="0" width="19" height="16" strokeWidth="0" fill="none" rx="0" ry="0">
</rect>
<text x="0.828125" zIndex="1" style="font-size:11;font-weight:bold;color:black;fill:black;" y="14">
6m
</text>
</g>

Tested in Edge, Firefox and Chrome.

Upvotes: 1

Related Questions