JavaScript檢測文章敏感詞

在一些博客或者論壇中,文章中的敏感詞需要顯示出來和高亮顯示起到提示用戶的作用。這個功能實現的方法有很多,下面是js的實現方式。

//將文章中匹配到的敏感詞羅列出來
<span style="color:#CC6600">敏感詞：</span><font color='red' id="show_word"></font>   

//文章顯示區域
<div style="overflow-x:hidden;scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon;background: #EAF3FA;" id="dispose_content"></div>
//1.在視圖模板(本示例中使用的是laravel中的blade模板)中使用js接受文章正文內容,先暫存起來
var contents = "{!! $data['article_content'] !!}";  //文章內容先存在變量contents中

//2.再使用ajax去獲取敏感詞,並使用正則在文章循環匹配每一個敏感詞
$.ajax({
    url: "{{\Config::get('app.blog_cms')}}article/sensitiveword", //請求該方法獲得銘感詞
    type: 'get',
    dataType: 'json',
}).done(function(data) {
    if(data.code == 200){
        var str = '';
        $.each(data.data, function(i, e) {
            if(contents.indexOf(e.word) > 0){
                str += e.word+', ';
                //若匹配到了銘感詞使用高亮顯示,這里使用的是紅色顯示
                contents = contents.replace(new RegExp(e.word,"gm"), '<span style="color:red;">'+e.word+'</span>');
            }
        });
        $('#show_word').html(str);   //將匹配到的敏感詞放到敏感詞顯示區域
        $('#dispose_content').html(contents);    //將敏感詞高亮后的文章放到文章顯示區域
    }
}).fail(function() {
    console.log("error");
});