find a matching values from 2 arrays, one array having an html element present in it-Javascript

user_4021059 0
Viewed 68

I want to compare 2 arrays and find the matching values from it, ideally this question has been asked before and seems like it partially works in my case.

lets say I have:

var array1 = ["test-123", "id-859","hi-8098", "hello-9090"];
var array2= ["Welcome <span>test-123</span>", "Welcome33 <span>id-859</span>","How are you <span>hi-8098</span>", "Geat <span>hello-9090</span>", "see ya <span>nono-58758</span>"];

In my case I have html element span and I want to match the values that are inside the <span> and return as o/p:

var newArray= ["Welcome", "Welcome33 ","How are you ", "Geat "];

so basically the values inside array1 matches to all the values inside array2 except the last one"see ya <span>nono-58758</span>". Using filter I can get the matching values, but these values are pretty straight forward,

newArray = array1.filter(e => array2.indexOf(e) !== -1); // in my case its undefined, as it does not recognize the html element in it.

any ideas on how to get matching values when an html element is present inside an array? Thanks!

javascript
3 Answers

indexOf don't use with Array but String . So you need to make string first

var array1 = ["test-123", "id-859","hi-8098", "hello-9090"];
var array2= ["Welcome <span>test-123</span>", "Welcome33 <span>id-859</span>","How are you <span>hi-8098</span>", "Geat <span>hello-9090</span>", "see ya <span>nono-58758</span>"];

var newArr =[];
for(var i of array1) {
  for(var j of array2) {
    var split = j.split("<span>");
    if(split[1].indexOf(i) > -1) {
      newArr.push(split[0]);
    }
  }
}
//newArray = array1.filter(e => array2.indexOf(e) != -1);you don't need this
console.log(newArr);

user_109208880

this works too

var array1 = ["test-123", "id-859","hi-8098", "hello-9090"];
var array2= ["Welcome <span>test-123</span>", "Welcome33 <span>id-859</span>","How are you <span>hi-8098</span>", "Geat <span>hello-9090</span>", "see ya <span>nono-58758</span>"];



var k=[];
array2.forEach(a=>{
  array1.forEach(b=>{
if(a.indexOf(b)!=-1){
k.push(a);
}

  })
 
})

let j=k.reduce((o,a)=>{
 let i= a.split("<span>");
 o.push(i[0]);
 return o;
},[])

console.log(j)

user_78495490

STEPS:

  1. Iterate through array1
  2. For each string in array1, interate array2
  3. Extract the desired text to search by string in array1 (Here I use split)
  4. Compare each string from array1 to every extracted text in array2
  5. Push the front text if match
  6. Trim (optional)

var array1 = ["test-123", "id-859","hi-8098", "hello-9090"]
var array2= ["Welcome <span>test-123</span>", "Welcome33 <span>id-859</span>","How are you <span>hi-8098</span>", "Geat <span>hello-9090</span>", "see ya <span>nono-58758</span>"]

let result = []
array1.forEach(searchStr => {
  array2.forEach(dataStr => {
    let stringInTag = dataStr.split('<span>')[1].split('</span>')[0]
    if (searchStr === stringInTag){
      let text = dataStr.split('<span>')[0]
      result.push(text.trim())
    }
  })
})
console.log(result)

user_37013930
Related