04/02/2016 Development / java script

I did a test in my job with WORKERS.

I create a file task.js

onmessage = function(e) {
    var html = e.data[0];
    for(var i=0; i<e.data[1].length;i++){
        var reg = new RegExp(e.data[1][i], 'gi');
        html = html.replace(reg, "<span class='wiki'>" + e.data[1][i] + "</span>");
    }
    postMessage(html);
}

And my app

window.onload = function() {
    var div = document.getElementById("text");
    var wikis = [
        "brownie",
        "lemon",
        "chocolate",
        "sesame",
        "lollipop",
        "oat",
        "cake",
        "gingerbread",
        "sweet",
        "applicake",
        "apple",
        "chups"
    ];

    var worker = new Worker('task.js');
    
    worker.onmessage = function (event) {
        var d = event.data;
        div.innerHTML = d;
    }
    worker.postMessage([div.innerHTML, wikis]);

}

And my HTML

<div id="text">esse eh o texto lemon, muito legal, cake</div>

css - .wiki {color: red}