JavaScript - Save Html In Word Document

Hi,
I was wondering if it's possible to capture a piece of HTML using XPath where the source is a sting rather than a document.

I know how to use xPath and document.evaluate() as I've used it before on actual web pages - I just dont understand how to run it on a string of HTML.

E.g. if I have this string:
var stg = "<div>The best-laid schemes o' <span>mice</span> an' men</div>";
I'd like to convert this string into something that I can run the document.evaluate() on so that I can find the contents of the SPAN element (without loading the string into a real browser page).

Thanks

Sorry about the title, I didn't know what else to use to describe my problem.

Basically, I'm generating a random word with a function; then I'm trying to pass this word down to another function. The problem is, when I pass the word, it changes each time (due to it being randomly generated originally).

I'm only calling the function once (via button click), but I'm also calling the function in my code lower down to retrieve the returned variable; and the function seems to be running again and returning a new word from my array.

Here's a snippet of my code:
Code:

function ranNum(){
	var ranNum = Math.round(Math.random()*10);
		var chosenWord = wordArray[ranNum];
			return chosenWord;
}

function makeBoxes(x){
//remove children when new word is chosen
var hM = document.getElementById("hangMan");
	while(hM.firstChild){
		hM.removeChild(hM.firstChild);
	}	
	
	var chosenWord = ranNum(x);
		var wL = chosenWord.length;

		//create box for length of letters in word
		var i = 0;
		for(i=0;i<wL;i++){		
			var cBoxes = document.createElement("div");
				cBoxes.className = "letterBoxes";
					cBoxes.innerHTML = chosenWord.charAt(i);
						hangMan.appendChild(cBoxes);
				}
				
		return chosenWord;
}

function checkLetter(y){
	var chosenWord = makeBoxes(y);
		alert(chosenWord);
}

So I generate a word with one button; now I need to be able to work with said word in my checkLetter() function. The word changes however.

Any help would be greatly received.

Dear All:

My apologies - this is probably something that comes up time and time again.

However, I was wondering - I realize there does not seem to be a "standard" way to do this (without additional libraries), but is there any "hacky" method that can be used to get XPath support in IE? What I mean is for parsing the loaded HTML document.

Thank you
Misha

Hi! how do I include .html files inside a document.write()?

Like document.write('include top.html' "hello!" 'include bottom.html') or something.

I searched for it, and found this:

<!--#include file="top.html" -->

But it doesn't work for me. What is wrong?

I would be very happy if someone could help me

Hi everybody I have a problem

I want a header that is a slideshow and use lightbox for other images.
No I have this all working but not at the same time.

If I use this code in this order only the first script that is the lightbox script works.
PHP Code:
<script type="text/javascript" src="js/jquery.min.js"></script>
        <script type="text/javascript" src="js/pirobox.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
        $().piroBox({
              my_speed: 300, //animation speed
              bg_alpha: 0.5, //background opacity
              slideShow : 'true', // true == slideshow on, false == slideshow off
              slideSpeed : 3, //slideshow
              close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox
              });
        });
        
        </script>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script src="js/jquery.cycle.all.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
           $('.slideshow').cycle({
              fx: 'scrollLeft',
              speed: 1000,
              timeout: 7000
           });
        });
        </script> 


If I use this code so I switched the order only the slideshow works:
PHP Code:
<script src="http://code.jquery.com/jquery-latest.js"></script>
        <script src="js/jquery.cycle.all.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
           $('.slideshow').cycle({
              fx: 'scrollLeft',
              speed: 1000,
              timeout: 7000
           });
        });
        </script>
<script type="text/javascript" src="js/jquery.min.js"></script>
        <script type="text/javascript" src="js/pirobox.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
        $().piroBox({
              my_speed: 300, //animation speed
              bg_alpha: 0.5, //background opacity
              slideShow : 'true', // true == slideshow on, false == slideshow off
              slideSpeed : 3, //slideshow
              close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox
              });
        });
        
        </script> 


I also tried this: but then they both did not work

PHP Code:
        <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
        <script type="text/javascript" src="js/jquery.cycle.all.min.js"></script>
        <script type="text/javascript" src="js/jquery.min.js"></script>
        <script type="text/javascript" src="js/pirobox.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
                                   
           $('.slideshow').cycle({
              fx: 'scrollLeft',
              speed: 1000,
              timeout: 7000
           });
           
           $().piroBox({
              my_speed: 300, //animation speed
              bg_alpha: 0.5, //background opacity
              slideShow : 'true', // true == slideshow on, false == slideshow off
              slideSpeed : 3, //slideshow
              close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox
              });
           
            });
        </script> 


Can you help me solve this problem so they both work?

Hi everybody I have a problem

I want a beautiful accordion header on my website and use pirobox that is a lightbox version.

I had this problem before but then u used a slideshow instead of this accordion header.

If I use this code: only the accordion works

Code:

        <script type="text/javascript" src="js/jquery.min.js"></script> 
        <script type="text/javascript" src="js/pirobox.js"></script>  
        <script type="text/javascript"> 
        $(document).ready(function(){ 
        $().piroBox({ 
              my_speed: 300, //animation speed 
              bg_alpha: 0.5, //background opacity 
              slideShow : 'true', // true == slideshow on, false == slideshow off 
              slideSpeed : 3, //slideshow 
              close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox 
              }); 
        }); 
         
        </script> 	

        <script language="javascript" type="text/javascript" src="js/mootools.js"></script>
	<script language="javascript" type="text/javascript" src="js/script.js"></script>

but if I change the order like this: only the pirobox works

Code:

        <script language="javascript" type="text/javascript" src="js/mootools.js"></script>
	<script language="javascript" type="text/javascript" src="js/script.js"></script>
        
        <script type="text/javascript" src="js/jquery.min.js"></script> 
        <script type="text/javascript" src="js/pirobox.js"></script> 
        <script type="text/javascript"> 
        $(document).ready(function(){ 
        $().piroBox({ 
              my_speed: 300, //animation speed 
              bg_alpha: 0.5, //background opacity 
              slideShow : 'true', // true == slideshow on, false == slideshow off 
              slideSpeed : 3, //slideshow 
              close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox 
              }); 
        }); 
         
        </script>

Then in the demo version there is this code:

Code:

        <script type="text/javascript">
		new LofmCordion( {wapperSelector: $E('#lof-cordion-1 .lof-cordion-wapper') } );
	</script>

I don't know where to use it. In the demo version it's in the end, but I tried that and it still didn't work.
I also used it immidiately after:

Code:

        <script language="javascript" type="text/javascript" src="js/mootools.js"></script>
	<script language="javascript" type="text/javascript" src="js/script.js"></script>

But it still doesn't work..

Please help me I'm kinda new to javascript and I really want to know how to solve this!

thanks

I found a nice script online that will count words. Problem is, I need it to also count each DIGIT (0-9) as a seperate word, whether the numbers are seperated by a space or not. I've searched this forum to no avail. Can anyone help me or show me how to do this, here is the original script:

Code:

<!-- TWO STEPS TO INSTALL WORD COUNT:

  1.  Copy the coding into the HEAD of your HTML document
  2.  Add the last code into the BODY of your HTML document  -->

<!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->

<HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!-- Original:  Shawn Seley -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
function CountWords (this_field, show_word_count, show_char_count) {
if (show_word_count == null) {
show_word_count = true;
}
if (show_char_count == null) {
show_char_count = false;
}
var char_count = this_field.value.length;
var fullStr = this_field.value + " ";
var initial_whitespace_rExp = /^[^A-Za-z0-9]+/gi;
var left_trimmedStr = fullStr.replace(initial_whitespace_rExp, "");
var non_alphanumerics_rExp = rExp = /[^A-Za-z0-9]+/gi;
var cleanedStr = left_trimmedStr.replace(non_alphanumerics_rExp, " ");
var splitString = cleanedStr.split(" ");
var word_count = splitString.length -1;
if (fullStr.length <2) {
word_count = 0;
}
if (word_count == 1) {
wordOrWords = " word";
}
else {
wordOrWords = " words";
}
if (char_count == 1) {
charOrChars = " character";
} else {
charOrChars = " characters";
}
if (show_word_count & show_char_count) {
alert ("Word Count:\n" + "    " + word_count + wordOrWords + "\n" + "    " + char_count + charOrChars);
}
else {
if (show_word_count) {
alert ("Word Count:  " + word_count + wordOrWords);
}
else {
if (show_char_count) {
alert ("Character Count:  " + char_count + charOrChars);
      }
   }
}
return word_count;
}
//  End -->
</script>

</HEAD>

<!-- STEP TWO: Copy this code into the BODY of your HTML document  -->

<BODY>

<form>
<textarea cols=40 rows=5 name=x>
</textarea>
<br>
<input type=button value="Count Words" OnClick ="CountWords(this.form.x, true, true);">
</form>

<p><center>
<font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

<!-- Script Size:  2.04 KB -->

My code is here and it works ...
However, I would like my dynamic table to show on the same page as my body and not on a new blank page. I have created a DIV and try playing around with the document.getElementById('monTab').innerHTML but it's not working out for me ...

What am i missing ?

Regards,

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>new Script - Javascript Cours 11</TITLE>
<META content="text/html"; charset="UTF-8" http-equiv="content-type">
<SCRIPT type="text/javascript">
	
   

	function createTable(){
	var Etudiant = new Array(Number(prompt("How many Students will you put in ?","")));

	document.write("<table border=\"1\">");
	for (var i=0; i<Etudiant.length; i++) {
	Etudiant[i] = window.prompt("S'il vous plait entrez le nom d'un etudiant " + (i+1) + ".","")
	alert("Nice to see you "+Etudiant[i]);
	
	document.write("<td>"+Etudiant[i]+"</td>");
	j = parseInt(prompt("Combien de notes voulez vous calculez ?"));
	for (h=0;h<j;h++){ 
	notes[h] = parseInt(prompt("S'il vous plait entrez la "+(h+1)+" note de "+Etudiant[i]));
	document.write("<td>"+notes[h]+"</td>");
	}
	
	
	document.write("<tr>");
	}


	
	document.write("</tr>");
	document.write("</table>");
	document.getElementById('monTab').innerHTML=Etudiant;
}


	</script>
<BODY>

<H1>Combien de note voulez vous cumulez ?</H1>
<br>
<br>

<input type="button" name="btnSubmit" value="TRY IT" onclick="createTable()">
<div id="monTab" size="10"> Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ... </div>
</BODY>
</HTML>

I found this line in one of the scripts on javascript.kit

<code>
if(document.layers|| document.getElementById|| document.all)
</code>

Could someone give me an idea on why this line would be used in a code?

Thank you very much

I'm working on a website that will basically embed a widget/frame sent by a handler into a user's current page. The user basically adds a script tag to where they would like the HTML to be. The script tag has their settings and is basically a document.write that calls all the code that we want displayed.

So here's my problem. We have a map that we need to add in a specific section, and to get the map we have to call another script tag. So we end up having a script tag (map) embedded in another script tag (the code for the widget/frame) or we end up having to document.write inside a document.write.

Now this works just fine and as expected in Firefox, Safari, and Chrome. However, Internet Explorer and Opera wait until the first document.write is completely finished before calling the embedded one. Of course the problem with this, is that it takes the map out of the document's flow and just appends it to the bottom left of the page. Since the rest of the page has already been called, there's no way to move the interior "map" script.

Any ideas? Basically just trying to figure out how (if even possible) to render an embedded script tag in Internet Explorer and be able to place it properly. I've tried everything that I can think of, including AJAX and Google's unescape script.

Any suggestions, I'd greatly appreciate it. Or even if you've encountered a similar problem, and know that it just isn't possible in IE or Opera, that would be fine too.

Thanks in advance!

Hey, I'm trying to make a game, I learned how to do so by reading tutorials but the problem is that I do not know how to implement the save/load function into the game, the tutorial surrounding that area was very unclear to me, and here I am...
Any tips on how to make this work is greatly appreciated, I wouldn't asked if I hadn't tried my best and every way I could think of. I'm still quite new to coding so...

The first piece of code is the game, the second one is what I'm trying to make the game work with.
I tried for a while and got the game to reset back to values, but only the values I set in the code so it never actually worked.
The tutorial doesn't give any live examples and I really am... not that bright when it comes to coding

Sorry and thanks, all inputs are appreciated.

I read tutorial from links below,
Javascript String Compression | Almost Idle Tutorial for save code
Incremental Lesson 9 - For Loops | Almost Idle Tutorial for the game code

Code:

/*Pleae refer to Lesson 9.txt for a full description on this lesson*/

//The timer to run code every second
var Timer = window.setInterval(function(){Tick()}, 1000);
var buildings = [];

//The object declaration for game saves
function GameSave() {
	this.money = 0;
	this.buildings = [];
	for (var i = 0;i < buildings.length;i++) {
		this.buildings[i] = 0;
	}
}

//The object declaration for buildings
function Building() {
	this.Name = "Lemonade Stand";
	this.Cost = 10;
	this.PerSec = 1;
}

//The function to initialise all buildings
function InitBuildings() {
	LoadBuilding("Lemonade Stand",10,1);
}

//The function to automatically load a building into the buildings array
function LoadBuilding(name,cost,persec) {
	var cur = buildings.length;
	
	buildings[cur] = new Building();
	buildings[cur].Name = name;
	buildings[cur].Cost = cost;
	buildings[cur].PerSec = persec;
}

//The function used to gather money
function GatherMoney() {
	game.money++; //++ tells javascript to add 1 to the variable
	
	//Display the player's current money
	document.getElementById("money").innerHTML = game.money;
}

//The function that gets run every second
function Tick() {
	for (var i = 0;i < buildings.length;i++) {
		game.money += game.buildings[i] * buildings[i].PerSec;
	}
	document.getElementById("money").innerHTML = game.money;
}

//The function to buy a lemonade stand
function Build(id) {
	if (game.money >= buildings[id].Cost) { //Check if the player has enough money, then subtract it and add a new building if they do
		game.money -= buildings[id].Cost;
		game.buildings[id] = game.buildings[id] + 1;
		document.getElementById("money").innerHTML = game.money;
		document.getElementById("Building1Qty").innerHTML = game.buildings[id];
	}
}

//Run this code once the page has loaded fully
window.onload = function() {
	InitBuildings();
	window.game = new GameSave();
};

Code:

/*Pleae refer to Compression.txt for a full description on this lesson*/

function NewGame() {
	this.name = "Our Game";
	this.description = "Our Game's Description";
	this.numbers = [];
	for (var i=0;i<10;i++) {
		this.numbers[i] = i;
	}
}

var Game = new NewGame();

window.onload = function() {
	var SaveGame = JSON.stringify(Game);
	SaveGame = encode_utf8(SaveGame);
	SaveGame = lzw_encode(SaveGame);
	window.localStorage['SaveName'] = SaveGame;
	
	
	SaveGame = window.localStorage['SaveName'];
	SaveGame = lzw_decode(SaveGame);
	SaveGame = decode_utf8(SaveGame);
	window.GameTwo = JSON.parse(SaveGame);
	
	document.getElementById("name").innerHTML = "Name: " + GameTwo.name;
	document.getElementById("desc").innerHTML = "Description: " + GameTwo.description;
	var numbers = "";
	for (var i=0;i<10;i++) {
		if (numbers.length == 0) {numbers = i;} else {numbers += ", " + i;}
	}
	document.getElementById("numbers").innerHTML = "Numbers: " + numbers;
}

// LZW-compress a string
function lzw_encode(s) {
    var dict = {};
    var data = (s + "").split("");
    var out = [];
    var currChar;
    var phrase = data[0];
    var code = 256;
    for (var i=1; i<data.length; i++) {
        currChar=data[i];
        if (dict['_' + phrase + currChar] != null) {
            phrase += currChar;
        }
        else {
            out.push(phrase.length > 1 ? dict['_'+phrase] : phrase.charCodeAt(0));
            dict['_' + phrase + currChar] = code;
            code++;
            phrase=currChar;
        }
    }
    out.push(phrase.length > 1 ? dict['_'+phrase] : phrase.charCodeAt(0));
    for (var i=0; i<out.length; i++) {
        out[i] = String.fromCharCode(out[i]);
    }
    return out.join("");
}

// Decompress an LZW-encoded string
function lzw_decode(s) {
    var dict = {};
    var data = (s + "").split("");
    var currChar = data[0];
    var oldPhrase = currChar;
    var out = [currChar];
    var code = 256;
    var phrase;
    for (var i=1; i<data.length; i++) {
        var currCode = data[i].charCodeAt(0);
        if (currCode < 256) {
            phrase = data[i];
        }
        else {
           phrase = dict['_'+currCode] ? dict['_'+currCode] : (oldPhrase + currChar);
        }
        out.push(phrase);
        currChar = phrase.charAt(0);
        dict['_'+code] = oldPhrase + currChar;
        code++;
        oldPhrase = phrase;
    }
    return out.join("");
}

function encode_utf8(s) {
  return unescape(encodeURIComponent(s));
}

function decode_utf8(s) {
  return decodeURIComponent(escape(s));
}

Reply With Quote




01-16-2015, 05:52 PM #2
Dormilich View Profile View Forum Posts

Senior Coder Join Date Jan 2010 Location Behind the Wall Posts 3,532 Thanks 13 Thanked 372 Times in 368 Posts


the problem is that I do not know how to implement the save/load function into the game


save it where? that particular question is important as JavaScript has only limited places where it can save something at all.

1) save it on the server => call a server script with the appropriate data (e.g. via AJAX)
2) cookies, very limited storage space, only works on the same browser
3) WebStorage, more space than cookies, but still only the same browser
4) IndexedDB (same as above)

Hello,

Is it possible to store the edited value in the div tag in the original file, such that next time i open the HTML file the new edited value appears.
Thanks in advance.

Have a Good day.

I have a long survey form and once its submitted it gets recorded into a database. I would love to be able to save a PDF version of the HTML form with all their radio buttons and textfields filled out at the same time its submitted. It would need a unique name that matches their record in the database (maybe it pulls the data that was entered into one of the form fields for the name).

Whether it gets uploaded to an ftp or just emailed to a mailbox doesn't really matter. The purpose of this is to basically have a visual interpretation of the data by a single user.

Is something like this even possible?

Hey Guys,

I'm working on a Gameserver for a Game, written in JavaScript.
I want to save all console.log()'s with Timestamp into a txt-file but I don't know how :/

Could you help me with it and tell me how I can do this?
for example, I want to save User-Logins into the logs. This is the code I'm using right now.
Code:

            case "LOGIN":
                var data = PacketModels.login.parse(datapacket);
                User.login(data.username, data.password, data.is_banned, data.is_online, function(result, user){
                    if(result){
                        if(user.is_banned == 1){
                            console.log("[WARNING] ".red + data.username + " tried to login. It failed because the User is banned!");
                            c.socket.write(packet.build(["LOGIN", "ISBANNED"]));
                        }else if(user.is_banned == 0){
                            if(user.is_online == 1){
                                console.log("[WARNING] ".red + data.username + " tried to login. It failed because the User is already online!");
                                c.socket.write(packet.build(["LOGIN", "ALREADYLOGGEDIN"]));
                            }else if(user.is_online == 0){
                                c.user = user;
                                c.enterroom(c.user.current_room);
                                c.user.is_online = 1;
                                c.user.save();
                                c.socket.write(packet.build(["LOGIN", "TRUE", c.user.current_room, c.user.pos_x, c.user.pos_y, c.user.username]));
                                console.log("[INFO] ".blue + data.username + " has logged in on     Map:[" + (c.user.current_room_name).blue + "] X:[" + String(c.user.pos_x).blue + "] Y:[" + String(c.user.pos_y).blue + "]");
                            }
                        }
                    ...

Reply With Quote




12-22-2014, 02:48 PM #2
sunfighter View Profile View Forum Posts

Senior Coder Join Date Jan 2011 Location Missouri Posts 4,830 Thanks 25 Thanked 672 Times in 671 Posts

JS will not save a text file. You need to do this with a server side language like PHP and if your going to all of that trouble you might want to study a database at the same time or soon after.

Hello all,

i am a newbie here.
I am starting to programme with javascript.

I am designing a website.
in This website there is an input with type = text and beside this input, there is another input with type = submit.

If i open this website: The default value on the search text is "Enter a text",
and if I click submit button, this button can recognize the value of the search text which is "Enter a text".


<input id="searchText" type="submit" value="Enter a text"/>
<input id="searchSubmit" type="submit" value="Submit"/>


And then i modified a little bit. I have this javascript:

var searchInput = $('#searchText');
searchInput.focus( function() {
searchInput.attr('value', '');
});

The goal is, when I click on the search text, the default text is gone.
And it worked.
But if i write a new text on the search text, the submit button still recognized the value of search text as empty string.

Can anyone please help me??

Thank you