javascript syntax string operators - javascript

help me out guys, i dont seem to know why the error is popping up. (i started learning javacript and i'm testing out how a string operator looks like)
<html>
<head><title>Head</title></head>
<body></body>
<script>
var age=27;
var info = "my name is Daniel, i am " +age + " years old " + 10;
console.log(info);
</script>
</html>
Uncaught SyntaxError: expected expression, got '<' debugger eval code:1

add script inside this BODY tag, and You can code like this
<html>
<head><title>Head</title></head>
<body>
<script>
var age=27;
// var info = "my name is Daniel, i am " +age + " years old " + 10;
var info = `my name is Daniel, i am ${age} years old 10`;
console.log(info);
</script>
</body>
</html>

The error is a JS error, not an HTML. If you put everything in JS(including HTML too) you probably get this error.
Either create two seperate files(.JS and .HTML) and put reference of .js in HTML
Put everything in HTML.
1. Two Files(JS and HTML)
var age = 27;
var info = "my name is Daniel, i am " + age + " years old " + 10;
console.log(info);
<html>
<head>
<title>Head</title>
</head>
<body></body>
</html>
2. Single HTML file
<html>
<head>
<title>Head</title>
</head>
<body></body>
<script>
var age = 27;
var info = "my name is Daniel, i am " + age + " years old " + 10;
console.log(info);
</script>
</html>

Related

How to make a space when concatenating strings

I have written some code that works fine but I am trying to make a space between the strings.
The code I have is:
<html>
<head>
<title> Concatenating Strings </title>
</head>
<body>
<script type = "text/javascript">
var greetingString = "Hello";
var myName = prompt ("Please enter your name","");
var concatString;
document.write(greetingString + "" + myName + "<br>");
concatString = greetingString + "" + myName;
document.write(concatString);
</script>
</body>
</html>
At the moment the script shows HelloMichael, I am wanting it to show Hello Michael. Can someone please advise me on how I can do that?
To insert a space character, simply insert a space character. For example:
greetingString + " " + myName
There's no space in your current output, because "" doesn't have a space in it.
put a space between hello and michael like this:
concatString = greetingString + " " + myName; //notice the space in the string
concatString = greetingString + " " + myName;
Simply change your "" to " ", the second has a space in it.

not getting output for json .saved in pars.html format [closed]

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
<html>
<head>
<center>
<h2> create object from json string</h2>
</center>
<script>
var text='{"fruits":[' + '{"name":"apple","price":"1000"},'
+ '{"name":"orange","price":"2000"},'
+ '{"name":"pine","price":"3000"}]}'
obj1=JSON.parse(text);
document.getElementById("demo").innerHTml = obj1.fruits[1].name + "" + obj1.fruits[2].price;
</script>
</head>
</html>
I am not able to get the o/p for this concept.I am not able to understand what is parsing.
Javascript is case-sensitive and you are currently using innerHTml instead of innerHTML, which will not work :
document.getElementById('demo').innerHTML = obj1.fruits[1].name + '' + obj1.fruits[2].price;
Additionally, you may want to simply use a single line to define your JSON string to avoid issues when building it :
var text = '{"fruits":[{"name":"apple","price":"1000"},{"name":"orange","price":"2000"},{"name":"pine","price":"3000"}]}'
Example
<body>
<center><h2>create object from json string</h2></center>
<pre>DEMO</pre>
<!-- Required Demo Section -->
<div id='demo'></div>
<script>
// Slightly revised building of JSON collection (to avoid concatenation issues)
var text= '{"fruits":[{"name":"apple","price":"1000"},{"name":"orange","price":"2000"},{"name":"pine","price":"3000"}]}';
var obj1= JSON.parse(text);
// Use of proper innerHTML property
document.getElementById("demo").innerHTML = obj1.fruits[1].name+ ' ' + obj1.fruits[2].price;
</script>
</body>
You can see this example in action here.
Use innerHTML instead of innerHTml
var text = '{"fruits":[' + '{"name":"apple","price":"1000"}, ' + '{"name":"orange","price":"2000"}, ' + '{"name":"pine","price":"3000"} ] }';
obj1 = JSON.parse(text);
document.getElementById("demo").innerHTML = obj1.fruits[1].name + " " + obj1.fruits[2].price;
<html>
<head>
<center>
<h2> create object from json string</h2>
</center>
<div id="demo"></div>
</head>
</html>
Errors I could spot:
Forgot to add #dome element on your page
innerHTml should be innerHTML
text variable is not being correctly initialised. It's a parsing error. String closing quote and plus '+ should be on the string closing line like in the example below.
var text = '{"fruits":[{"name":"apple","price":"1000"},' +
'{"name":"orange","price":"2000"},' +
'{"name":"pine","price":"3000"}' +
']}';
obj1 = JSON.parse(text);
document.getElementById("demo").innerHTML = obj1.fruits[1].name + " " + obj1.fruits[1].price;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<center>
<h2> create object from json string</h2>
</center>
<div id="demo"></demo>

I need some troubleshooting with my HTML/JavaScript code

I am trying to create code that when you press a button, it will change the value of a variable and replace some text.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<p id="unitts">You have 0 unitts</p>
<script type="text/javascript">
var unitt = 0;
function unittIncrease() {
var unittPrev = unitt;
unitt++;
document.getElementById(unitts).innerHTML.replace("You have " + unittPrev.toString() + " unitts.", "You have " + unitt.toString() + " unitts.");
}
</script>
<button id="unittIncrease" onclick="unittIncrease();">Digitize Unitt</button>
</body>
</html>
When I press the button, nothing happens to the text.
I don't know why this does not work.
Please help me!
EDIT: I am only 11 years old,
please don't throw your wizard
code at me.
maybe you should remove your button system and add a while loop that
automatically add a unit but waits one second with a setInterval
function
I think you should write the js code like this
document.getElementById('unitts').innerHTML = "You have"....
Instead of:
document.getElementById(unitts).innerHTML.replace("...")
Your JavaScript should be (note the unitts wrapped in quotes and the full stop removed):
document.getElementById('unitts').innerHTML = "You have " + unitt + " unitts";
Instead of:
document.getElementById(unitts).innerHTML.replace("You have " + unittPrev.toString() + " unitts.", "You have " + unitt.toString() + " unitts.");
In the latter, it is looking for the non-existent variable unitts instead of the string 'unitts'. Also, you are looking for the text You have x unitts. which cannot be found because in your HTML, it is just You have x unitts without the full stop.
Edit
See this plnkr.
Apart from the issues that the other answer mentions, by calling .replace method on the .innerHTML property of the element, the content of it doesn't change. You should reset the property by using the returned value of the method call:
el.innerHTML = el.innerHTML.replace(...);
Also, as you are trying to increase a number, instead of replacing all the characters, you can just replace the numeric part:
var unitts = document.getElementById('unitts');
function unittIncrease() {
unitts.textContent = unitts.textContent.replace(/\d+/, function(n) {
return +n + 1;
});
}
https://jsfiddle.net/h6odbosg/

Use prompt to generate table and add content to it based on input

I need to use Javascript to generate a table from user input in a prompt window.
This is for homework and we haven't covered things like jQuery or function scripting, all we've done is basic calculation scripts and the teacher has asked that we use a similar method to what we've been taught to solve the issue.
I have Googled and tried to solve it from what I found, but I don't particularly want to use methods we haven't been taught just yet, and the one method I found that does work is far more advanced than what we've done in class. And I just know that if I ask the teacher he won't be very helpful.
This is what I've got so far, and it generates a list of the input times table up to 10, but I need that data to end up in a table, all I need to know is where do I need the document.write tags to generate the numbers into a table?
Can it be done with some simple commands? Or is it more advanced than what we've been taught so far?
<html>
<body bgcolor=#66ccff text=#ff6600>
<script type="text/javascript">
var number = prompt("Please enter a number:");
for (i=1; i <= 10; i++)
{document.write( number + " x " + i + " = " + i*number + "<br>");};
</script>
</body>
</html>
What about this way:
<html>
<body bgcolor="#66ccff" text="#ff6600">
<script type="text/javascript">
var number = prompt("Please enter a number:");
document.write('<table border="1">');
for (i=1; i <= number; i++) {
document.write('<tr><td>' + number + " x " + i + "</td><td>=</td><td>" + i*number + "</td></tr>");
};
document.write('</table>');
</script>
</body>
</html>
I just assigned 2 to undefined number so at first run you don't have the error
<script type="text/javascript">
var number = prompt("Please enter a number:");
if(number == undefined)
number =2;
for (i=1; i <= 10; i++)
{document.write( number + " x " + i + " = " + i*number + "<br>");};
</script>
jsbin link is here: https://jsbin.com/puvitinaxi/edit?html,output

Can someone tell me if they see this

I am having problems when I try to pull it up on my computer the page is blank. I am not understanding this. Like when you click on the file button on the internet and you click open file that file shows up blank. Can someone help me understand why it is doing that. Thanks.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<title>Week 10</title>
<script type="text/javascript">
/ *<![CDATA[ */
Var name;
firstName = "Valerie";
lastName ="Shipbaugh";
var placeOfBirth;
name=FirstName +"";
name += lastName;
placeOfBirth ="Houston";
placeOfBirth +=",Texas";
nameArray = name.split("");
/*]]>*/
</script>
</head>
<body>
<script type="text/javascript">
//<![CDATA[
document.write("<p> My first name is : + nameArray[0]
+ "<br />");
document.write("My last name is: "+ nameArray[1]
+ "<br />");
*/
The brackets[] specifies alternate characters allowed in a patch pattern.
It uses metacharacters which are special characters that define the pattern matching rules ina regular experession.
*/
document.write("There are " + firstName.length
+ " characters in my first name" + " <br/>");
*/
This one called the length property.
This returns the number of characters in a string.
*/
document.write("I was born in " + placeOfBirth + " <br/>");
*/
With this string we are using concatenation operations.
*/
document.write("<p>My initials are: " + firstName.charAt(0) +
lastName.charAt(0) + "</p>");
*/
The last one return the character at the specific position in a text string
returns an empty string if the specified position is greater than the length of the string.
*/
//]]>
</script>
</body>
</html>
So where my comments are to explain what is going on is in the wrong place???
There is a more general way to solve this problem:
Take everything out of this file and
copy it into notepad.
Put just the
<html>and </html> into the file
Begin copying very small blocks into
the file one at a time, each time
reload the page
Soon you will see
one small block that causes the
failure, then you can assess that
small block.
Look at errors reported by the browser (tools->error console in firefox for example) it will hi-light errors such as you mismatched /**/ comments & the missing closing quote character from;
document.write("<p> My first name is : + nameArray[0]
Also js is case sensitive so its var not Var, which you should use to define all your variables such as firstname (which you incidentally later refer to as Firstname) etc.
Of course it won't work, the comment blocks aren't even right:
*/
The brackets[] specifies alternate characters allowed in a patch pattern.
It uses metacharacters which are special characters that define the pattern
matching rules ina regular experession.
*/
Should be:
/*
The brackets[] specifies alternate characters allowed in a patch pattern.
It uses metacharacters which are special characters that define the pattern
matching rules ina regular experession.
*/
Also, you really should avoid using document.write. In certain cases, that is what causes a blank page (if I remember correctly, when you use it after page load).
JavaScript is case sensitive - so in the first section of your scripts:
Var name; //var is with a lowecase "v"
firstName = "Valerie";
lastName ="Shipbaugh";
var placeOfBirth;
name=FirstName +""; //firstName was created with a lowecase "f"
Later you have this...
document.write("<p> My first name is : + nameArray[0]
+ "<br />");
You're missing a quote in there, should be
document.write(" My first name is : " + nameArray[0]
+ "");
And finally, comments open and close like this:
/* comment */
Not like this
*/ error */
Fixing these things will make the script run. However, it's not doing what I suspect you want. You are trying to split() the string containing the name, but there's nothing to split it on. You need to add a space between then and try this:
nameArray = name.split(" ");
You can see this working here:
http://jsfiddle.net/CM7fx/
Test in multiple browsers and make sure you have javascript enabled id' suggest first
The comments were wrong, the variable name are case sensitive. Here is a working version without comments, you can re-add those
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<title>Week 10</title>
<script type="text/javascript">
var name;
var firstName = "Valerie";
var lastName ="Shipbaugh";
var placeOfBirth;
name= firstName + " " + lastName;
placeOfBirth ="Houston ,Texas";
var nameArray = name.split(" ");
</script>
</head>
<body>
<script type="text/javascript">
document.write("<p> My first name is : " + nameArray[0] + "<br />");
document.write("My last name is: " + nameArray[1] + "<br />");
document.write("There are " + firstName.length + " characters in my first name" + " <br/>");
document.write("I was born in " + placeOfBirth + " <br/>");
document.write("<p> My initials are: " + firstName.charAt(0) + lastName.charAt(0) + "</p>");
</script>
</body>
</html>

Categories