How to use javascript code

Javascript is a widely used programming language that can be used in many fields such as web development, desktop software, and mobile application development. This article will introduce how to use Javascript code to help beginners get started quickly.

1. Create Javascript code

Introducing Javascript code into HTML files is the most common way. In the HTML code, Javascript code is introduced through the <script> tag, for example: </script>

<script>
// 在这里写JavaScript代码
</script>

You can also save the Javascript code as a separate .js file and then introduce it in the HTML file. For example, we can create a file named "script.js" and reference it in the HTML file:

<script src="script.js"></script>

2. Variables

Variables are used to store data in Javascript. You need to use the keyword var when creating a variable, for example:

var name = "John";

The above code creates a variable name and assigns the string "John" to this variable. In Javascript, variables are dynamically typed, that is, the type of the variable can change dynamically. For example, we can change the value of the variable name above to a numeric type:

var name = 10;

The name of the variable can be composed of letters, numbers, underscores, and dollar signs, but it cannot start with a number. Variable names are case-sensitive.

3. Data types

Javascript has a variety of data types, including strings, numbers, arrays, objects, etc.

1. String

String is a data type used to represent text and can be enclosed in single quotes or double quotes. For example:

var name = "John";
var greeting = 'Hello';

2. Numbers

Numbers in Javascript are divided into integer and floating point types. For example:

var age = 18;
var price = 9.99;

3. Array

Array is a data type used to store a set of data. Each element of the array can be of any data type. When declaring an array, you need to use square brackets [] and separate each element with a comma. For example:

var fruits = ["apple", "orange", "banana"];

You can access array elements by index, and array index starts from 0. For example, access "apple" in the above array:

var fruit = fruits[0];

4. Object

Object is a data type used to describe things in reality. Objects consist of properties and methods. Properties are the characteristics of an object, and methods are the behavior of the object. For example:

var person = {
  name: "John",
  age: 18,
  sayHello: function() {
    alert("Hello!");
  }
};

The above code creates a person object, including name, age and a sayHello method. You can access the properties and methods of an object through dots or square brackets. For example, to access the name in the person object:

var name = person.name;

4. Control flow

Control flow is a mechanism to control the order of program execution. Javascript provides a variety of control flow statements.

1. if statement

The if statement is used to execute different blocks of code based on conditions. For example:

if (age > 18) {
  alert("You are an adult.");
} else {
  alert("You are a child.");
}

The above code determines whether the age is greater than 18 years old based on the value of the variable age, and executes different code blocks.

2. for loop

The for loop is used to repeatedly execute the same block of code. For example, to output numbers from 1 to 10:

for (var i = 1; i <p>The above code uses the variable i to loop from 1 to 10, each time outputting the current i value. </p><ol start="3"><li>while loop</li></ol><p>The while loop is used to repeatedly execute the same block of code while a condition is true. For example, output numbers from 1 to 10: </p><pre class="brush:php;toolbar:false">var i = 1;
while (i <p>The above code uses the variable i to start a loop from 1, output the current i value each time, and increase i by 1, until the loop ends when i is greater than 10. </p><p>5. Function</p><p>A function is a block of code that completes a specific task and can be called repeatedly for execution. Functions can be defined in Javascript through the keyword function. For example, define a function that calculates the sum of two numbers: </p><pre class="brush:php;toolbar:false">function add(a, b) {
  return a + b;
}

The above code defines a function named add, which receives two parameters a and b and returns their sum.

6. DOM operation

Javascript can operate the DOM (Document Object Model) tree to achieve the effect of dynamically updating HTML pages. The DOM tree is a structured representation of an HTML page, and each HTML element is a node in the DOM tree. Javascript can operate these nodes through the DOM API, such as modifying the content, attributes, styles, etc. of the elements.

1. Get elements

You can use the getElementById, getElementsByClassName, getElementsByTagName and other methods of the document object to obtain HTML elements. For example, get the element with id "myDiv":

var myDiv = document.getElementById("myDiv");

2. Modify element content and attributes

You can use the innerHTML, innerText and nodeValue attributes of the node to modify the content of the node . For example, to modify the content of the element with the id "myDiv":

var myDiv = document.getElementById("myDiv");
myDiv.innerHTML = "Hello World!";

You can use the getAttribute and setAttribute attributes of the node to modify the attributes of the node. For example, modify the href attribute of the element with the id "myLink":

var myLink = document.getElementById("myLink");
myLink.setAttribute("href", "http://www.example.com");

3. Modify the element style

You can use the style attribute of the node to modify the style of the node. For example, modify the background color of the element with the id "myDiv":

var myDiv = document.getElementById("myDiv");
myDiv.style.backgroundColor = "red";

The above are the basic operations of Javascript code. After mastering these contents, the application scope of Javascript will be further expanded.

The above is the detailed content of How to use javascript code. For more information, please follow other related articles on the PHP Chinese website!