Home > Developer > Web Develop
The script can be in the <body> or
<script src= "Myscript.js" ></script>
. JavaScript can output data in different ways:
Use the Window.alert () pop-up warning box.
Use the document.write () method to write content to an HTML document.
Writes to an HTML element using InnerHTML.
Use Console.log () to write to the browser's console.
. JavaScript is sensitive to capitalization.
You can wrap lines of code in a text string by using a backslash
. Object definition
var person = {firstName: "John", LastName: "Doe", Age:50, Eyecolor: "Blue"};
var person = {
FirstName: "John",
LastName: "Doe",
id:5566
};
document.getElementById ("Demo"). InnerHTML =
Person.firstname + "" + person.lastname;
var person = {
FirstName: "John",
LastName: "Doe",
id:5566
};
document.getElementById ("Demo"). InnerHTML =
person["FirstName"] + "" + person["LastName"];
. In HTML, a global variable is a Window object: All data variables belong to the Window object.
The following is an example of an HTML event:
HTML Page finished loading
When the HTML input field changes
HTML button is clicked
<button onclick= ' getElementById ("demo"). Innerhtml=date () ' > What time Is it now?? </button>
<button onclick= "this.innerhtml=date ()" > Now the time is?</button>
. Common HTML Events
The following is a list of some common HTML events:
Event Description
onchangeHTML element changes
OnClick user clicks on HTML element
onmouseover The user moves the mouse over an HTML element
onmouseout The user to move the mouse away from an HTML element
onkeydown The user presses the keyboard key
The OnLoad browser has finished loading the page
. For/in Loop---JavaScript for/in statements iterate through the properties of an object:
var person={fname: "John", lname: "Doe", age:25};
for (x in person)
{
Txt=txt + person[x];
}
. Constructor properties
The constructor property returns the constructor for all JavaScript variables.
Instance
"John". Constructor//Return function String () {[native code]}
(3.14). constructor//Return function number () {[native code]}
False.constructor//Return function Boolean () {[native code]}
[1,2,3,4].constructor//Return function Array () {[native code]}
{name: ' John ', age:34}.constructor//Return function Object () {[native code]}
New Date (). constructor//Return function Date () {[native code]}
function () {}.constructor//return functions () {[native code]}
. typeof operator
You can use the TypeOf operator to view the data type of a JavaScript variable.
Instance
typeof "John"//Return string
typeof 3.14//return number
typeof NaN//return number
typeof false//returns Boolean
typeof [1,2,3,4]//Return object
typeof {name: ' John ', age:34}//Return object
typeof new Date ()//Return object
typeof function () {}//return function
typeof MyCar//return undefined (if MyCar not declared)
typeof null//Return object
. Use the constructor property to see if an object is an array (containing the string "Array"):
Instance
function IsArray (MyArray) {
Return myArray.constructor.toString (). IndexOf ("Array") >-1;
}
. Converting a number to a string
The global method string () can convert a number to a string.
This method can be used for any type of number, letter, variable, expression:
Instance
String (x)//Converts the variable x to a string and returns
String (123)//Converts the number 123 to a string and returns
String (100 + 23)//Converts a numeric expression to a string and returns
The number method toString () also has the same effect.
Instance
X.tostring ()
(123). ToString ()
(+ +). ToString ()
EG1:
document.getElementById ("Demo"). Innerhtml=date ();
EG2:
document.write ("
EG3:
Alert (' Welcome! ')
EG4:
function Changeimage ()
{
Element=document.getelementbyid (' MyImage ')
if (Element.src.match ("Bulbon"))
{
element.src= "/images/pic_bulboff.gif";
}
Else
{
element.src= "/images/pic_bulbon.gif";
}
}
function MyFunction ()
{
X=document.getelementbyid ("demo")//Find element
x.style.color= "#ff0000"; Change Style
}
function MyFunction ()
{
var X=document.getelementbyid ("Demo"). Value;
if (x== "" | | IsNaN (x))
{
alert ("Not a number");
}
}
var person = {
FirstName: "John",
LastName: "Doe",
id:5566,
Fullname:function ()
{
return this.firstname + "" + this.lastname;
}
};
document.getElementById ("Demo"). InnerHTML = Person.fullname ();
document.getElementById ("Demo1"). InnerHTML = "non-parenthesized output function expression:" + person.fullname;
document.getElementById ("Demo2"). InnerHTML = "Parentheses output function Execution result:" +
Person.fullname ();
EG5:
var txt = "abcdefghijklmnopqrstuvwxyz";
var sln = txt.length;
Eg6:
cars=["BMW", "Volvo", "Saab", "Ford";
List
{
document.write (Cars[0] + "<br>");
document.write (Cars[1] + "<br>");
document.write (cars[2] + "<br>");
Break list;
document.write (Cars[3] + "<br>");
document.write (Cars[4] + "<br>");
document.write (Cars[5] + "<br>");
}
JS Note One
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
