Question

我有一个键入字段，链接到afinn单词列表。这是我正在使用的项目：https://github.com/CodingTrain/website/tree/master/CodingChallenges/CC_044_afinn111SentimentAnalysis/P5

从列表中检测到的单词写在下面，说明单词的得分。

我希望检测到的单词直接在键入字段中突出显示。（对于得分为-5到-1的否定词，红色阴影；对于得分为+1到+5的肯定词，绿色阴影）

我无法创建一个在stackoverflow中运行的示例，但这是github中的一个示例，它现在如何工作： https://darenr.github.io/afinn/

该代码段将在网站上使用。代码使用的是p5.js库和afinn单词表（json文件）：https://github.com/CodingTrain/website/blob/master/CodingChallenges/CC_044_afinn111SentimentAnalysis/P5/afinn111.json 我通常会做设计，所以我真的不太擅长编码。希望您能理解这个问题。

javascript：

// Daniel Shiffman
// http://codingtra.in
// http://patreon.com/codingtrain
// Code for: https://youtu.be/VV1JmMYceJw


var afinn;

function preload() {
  afinn = loadJSON('afinn111.json');
}


function setup() {
  noCanvas();
  console.log(afinn);

  var txt = select('#txt');
  txt.input(typing);

  function typing() {
    var textinput = txt.value();
    var words = textinput.split(/\W/);
    console.log(words);
    var scoredwords = [];
    var totalScore = 0;
    for (var i = 0; i < words.length; i++) {
      var word = words[i].toLowerCase();
      if (afinn.hasOwnProperty(word)) {
        var score = afinn[word];
        console.log(word, score);
        totalScore += Number(score);
        scoredwords.push(word + ': ' + score + ' ');
      }
    }
    var scorePar = select('#scoreP');
    scorePar.html('score: ' + totalScore);
    var comp = select('#comparativeP');
    comp.html('comparative: ' + totalScore / words.length);
    var wordlist = select('#wordlistP');
    wordlist.html(scoredwords);

    //console.log(txt.value());
  }
}





function draw() {

}

html：

<html>
<head>
  <meta charset="UTF-8">
  <title>AFINN-111 demo</title>
  <script language="javascript" type="text/javascript"             src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.8.0/p5.min.js"></script>
  <script language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.8.0/addons/p5.dom.min.js"></script>
  <script language="javascript" type="text/javascript" src="sketch.js">    </script>
</head>
<body>
  <h1>AFINN Sentiment Demo</h1>

  <p>
    Type here:<br />
    <textarea id="txt" cols=50 rows=10></textarea>
  </p>

  <p id="scoreP"></p>
  <p id="comparativeP"></p>
  <p id="wordlistP"></p>

</body>
</html>

问题：我需要从afinn列表中计分的单词直接在键入字段中突出显示。红色阴影（负数，从-5到-1）和绿色阴影（负数，从+1到+5）

希望任何人都能提供帮助！非常感谢！

如何直接在文本中突出显示单词表中的单词？

0 个答案: