Создать текстовую область и кнопку анализа

Question

Создать текстовую область и кнопку анализа

1

Я работаю над домашней работой в колледже. У меня с ним много проблем и застревание. Мои товарищи по классу не помогают мне, и инструктор не ответил. Я надеюсь, что я получу какую-то помощь/понимание здесь. В текущем задании, над которым я работаю, и сегодня он должен:

Создайте страницу, содержащую текстовую область и кнопку "анализ". В области результатов будет отображаться частота слов символов x. Например, текст "один два три" содержит 2 3-символьных слова и 1 5-символьное слово. Улучшение первоначального дизайна было бы исключить любые посторонние символы, которые могут исказить счет.

Я только начинаю его сейчас, поэтому я добавлю код здесь, когда обновляюсь. Я знаю, что у меня не будет проблемы с частью HTML, JavaScript будет моей проблемой. Из того, что я получаю, мне нужно будет иметь функцию, которая учитывает слова и символы в каждом слове. Но он должен исключать пробелы и символы, такие как:,. ';/. Я до сих пор не сталкивался с этим кодом, поэтому любой вклад в том, как я должен создать javascript, будет полезен. Также кажется, он хочет, чтобы я перечислил, сколько слов имеют одинаковые символы? я читаю это правильно?

Мой код:

<!DOCTYPE html>
<html>

<body>

    <textarea id="txtarea">
    </textarea>
    <input type="button" id="analyze" value="Analyze" onclick="myFunction()" />

    <p id="demo"></p>
    <p id="wcnt"></p>

    <script>
        function myFunction() {
            var str = document.getElementById("txtarea").value;
            var res = str.split(/[\s\/\.;,\-0-9]/);
            var n = str.length;
            document.getElementById("demo").innerHTML = "There are " + n + " characters in the text area.";
            for (var i = 0; i < res.length; i++) {

                s = document.getElementById("txtarea").value;
                s = s.replace(/(^\s*)|(\s*$)/gi, "");
                s = s.replace(/[ ]{2,}/gi, " ");
                s = s.replace(/\n /, "\n");
                document.getElementById("wcnt").innerHTML = "There are " + s.split(' ').length + " words in the text area.";
            }

        }
    </script>

</body>

</html>

Теперь мне нужно выяснить, как заставить его подсчитывать символы каждого слова, а затем выводить, сколько слов имеет х количество символов. Например, 5 слов имеют 4 символа и так далее. Какие-либо предложения?

Jason Hopper 09 июнь 2017, в 21:14

Источник

Теги:

javascript

css

html5

3 ответа

Ещё вопросы

Roko C. Buljan · Answer 1 · 2017-06-09T17-52-00.000Z

var textarea = document.getElementById("textarea"),
    result = {}; // object Literal to hold  "word":NumberOfOccurrences

function analyzeFrequency() {

  // Match/extract words (accounting for apostrophes)
  var words = textarea.value.match(/[\w']+/g); // Array of words
  
  // Loop words Array
  for(var i=0; i<words.length; i++) {
    var word = words[i];
    // Increment if exists OR assign value of 1
    result[word] = ++result[word] || 1; 
  }
  console.log( result );
}


analyzeFrequency(); // TODO: Do this on some button click

<textarea id="textarea">
  I am working on my college-homework.
  Homework I am having a lot of difficulty with it and getting stuck.
  My class mates are not helping me and the instructor hasn't responded.
  I am hoping I might get some help/understanding here.
</textarea>

Обратите внимание на то, что Homework и homework (строчные буквы) регистрируются как два разных слова, я оставлю его вам, чтобы исправить это - при необходимости и реализовать analyzeFrequency() триггер на некотором нажатии кнопки.

sorayadragon · Answer 2 · 2017-06-09T16-47-00.000Z

Скорее всего, вам придется использовать функцию разделения JavaScript с регулярным выражением, чтобы определить все символы, которые вы не хотите включать. Затем проведите через результирующий массив и подсчитайте символы в каждом слове.

var words = document.getElementById("words");
var analyze = document.getElementById("analyze");

analyze.addEventListener("click", function(e) {
    var str = words.value;
    var res = str.split(/[\s\/\.;,\-0-9]/);
    for(var i = 0; i < res.length; i++) {
      alert(res[i].length);
    }
});

<textarea id="words">This is a test of this word counter thing.</textarea>
<br/>
<button id="analyze">
   Analyze
</button>

Итак, что я получаю, прочитав это, так это то, что str.split удаляет все, что не является словом, поэтому оно просто считает слово. следующая часть просматривает каждое слово и подсчитывает символы в слове?

Peter Schweitzer Jr · Answer 3 · 2017-06-09T17-24-00.000Z

Ваш инструктор НЕ хочет, чтобы вы указали, как слова могут иметь одни и те же символы, а не столько же символов. Основной алгоритм:

Назначьте значение текстовой области переменной.
Преобразуйте это строковое значение в массив. В javascript это может быть выполнено с помощью метода разделения строк, используя регулярное выражение, содержащее класс символов.
Итерации над этим массивом, проверяющие каждый элемент на его длину. Для каждого элемента добавьте свойство счетного объекта, имя свойства которого является длиной элемента.
Перейдите по списку свойств объекта подсчета. Выведите в область результатов каждое имя свойства и его значение.