1
I’m trying to make a dynamic table for the frequency count of words extracted from an external file. I came across a template, now I’m trying to change the output to display a table instead of showing the results in a text box. Two columns should appear triggered by both onClick buttons that display the word and its frequency of occurrences.
Below is what I have worked so far:
<script type="text/javascript">
<!--
var w;
function openFile(url) {
w = window.open();
w.location = url;
}
function retrieveText() {
pre = document.getElementById("count");
retrieve(w.document.body);
}
function retrieve(node) {
if (node.nodeType == Node.ELEMENT_NODE) {
for (var m = node.firstChild; m != null; m = m.nextSibling)
retrieve(m);
}
else if (node.nodeType == Node.TEXT_NODE) {
var p = document.getElementById("ta_1");
p.appendChild(document.createTextNode(node.data));
}
}
function data(str, uc){
// implement regular expressions and regex
str=str.replace(/<[^>]+>/g,' ');
var tem, M;
var Rx= /\b(([a-z])([a-z]*'?[a-z]*))/ig;
// tests to see whether there is a match in string
while((M= Rx.exec(str)) != null){
if(uc!== true) tem= M[2]+M[3];
else tem= M[1];
if(!this[tem]) this[tem]= 0;
this[tem] += 1;
}
}
// This function takes a string argument and increases count for every element in 'this'
// JS searches key in 'Glossary' prototype
data.prototype.getCount= function(){
var count=0;
for(var w in this){
// hasOwnProperty - function that takes a string argument
if(this.hasOwnProperty(w)){
count+=this[w];
}
}
return count;
}
data.prototype.getList= function(){
var A= [];
var tem;
for(var w in this){
tem= this[w];
if(this.hasOwnProperty(w)) A[A.length]= [w,tem];
}
A.sort(function(word1,word2){
if(word1[0]== word2[0])return 0;
return word1[0]>word2[0]? 1: -1;
})
return A;
}
// function to display alphab
data.prototype.toString= function(freq){
var L, last, nxt;
var A=this.getList();
L= A.length;
for(var i= 0; i<L;i++){
nxt=A[i][0].charAt(0);
if(last!=nxt)A[i][0]='\n\n'+nxt+'\n'+A[i][0];
last=nxt;
if(freq=== false)A[i]= A[i][0];
else{
A[i]= A[i].join(': ');
}
}
A=A.join(', ').replace(/, \n/g,'\n');
return L+' different words of '+this.getCount()+'\n\n'+A;
}
// function to display freq
data.prototype.frequency= function(){
var A= this.getList();
var C=this.getCount();
var L= A.length;
var B= [],v,n;
while(A.length){
tem= A.shift();
v= tem[1];
n= tem[0];
if(!B[v]) B[v]= [v];
B[v].push(n);
}
while(B.length){
tem= B.pop();
if(tem){
A.push(tem.shift()+' occurrence(s): \n\t'+tem.join(', '));
}
}
return 'Word Frequency ('+L+' different words of '+C+' total)\n\n'+A.join('\n')
}
if(document.getElementById && Object.hasOwnProperty){
window.onload= function(){
var t= document.getElementsByTagName('textarea');
var b= document.getElementsByTagName('button');
b[0].onclick= function(){
var newdt= new data(t[0].value);
t[1].value= newdt.toString(false);
}
b[1].onclick= function(){
var newdt= new data(t[0].value);
t[1].value= newdt.frequency();
}
}
}
-->
</script>
</head>
<body>
<h1>Word Counter</h1>
<div>
<p>Filename: <input id = "url" name="url" size=15 type="Text"/></p>
<a href="javascript:openFile(document.getElementById('url').value)">
Open document</a>
<a href="javascript:retrieveText(w.document.body)">Retrieve text</a><br/>
<textarea id="ta_1" rows="20">
</textarea>
<pre id="count"> </pre><br/>
</div>
<div>
<p>
<button>Alphabetical Order</button>
<button >Frequency Order</button></p>
<textarea id="ta_2" rows="20">
</textarea>
</div>
<div id="freqTable"></div>
</body>
</html>
Just one question: the file that will be uploaded stays on the site itself, right?
– Gustavo Rodrigues
You will get an array of table values?
– Felipe Avelar
Is more or less that what do you want? If it is, I put in the answer with the right codes. PS: No
input
values have to be divided by a;
– Felipe Avelar
What’s your problem? What doesn’t work or what you can’t do??
– DontVoteMeDown