Javascript basic study notes (a must-read for newbies)

What is a variable?

Variables are containers used to store information

Declaration of variables

Syntax:

var 变量名

Variable name = Value;

Variables must be declared first and then assigned a value

Variables can be assigned repeatedly

Naming rules for variables

Variables Must start with a letter;

Variables can also start with $ and _ symbols (but we do not recommend this);

Variable names are case-sensitive (a and A is a different variable).

Statement

A statement ends with a semicolon; if the semicolon is omitted, the parser determines the end of the statement.

A good coding habit should end with;

Data type

In JavaScript, a piece of information is a value (value) . Values ​​come in different types, the most familiar type being numbers. A string value is one or more words enclosed in

quotes.

Number Any numeric value. The number can be with a decimal point or without 68.57

string characters in quotation marks. You can use single or double quotes "hello, world"

Boolean true or false true

Undefined and Null Undefined This value indicates that the variable does not contain a value. A variable can be cleared by setting its value to null.

Object Any value associated with the object

Function The value returned by the function

1 var a; //a为undefined
2 var a = 6; //a 为数字
3 var a = "Jason"; // a 为字符串

What is a function?

A function is a set of JavaScript statements that perform a certain task

Basic syntax:

function 函数名(){
  函数代码;
}

Function name ();

Description:

function defines the function keyword.

"Function name" is the name you give the function.

Replace "function code" with code that completes a specific function.

A type of "second function name" function call

1 function add2(){
2 var sun = 3 + 2;
3 alert(sun);
4 }
5 add2();//调用函数直接写函数名直接弹出函数代码

1 <input type="button" value="点击我" onclick="add2()" />
2 <!-- 单击按钮后，调用函数，onclick为点击事件 -->

Output content (document.write)

document.write() directly Output content in a web page.

First method: The output content is enclosed in "", and the content within the "" is directly output.

document.write("I love JavaScript!");

The second type: output content through variables

var mystr = "hello world";
document.write(mysrt);//直接写变量名，输出变量存储的内容

The third type: output multiple contents, and connect the contents with a + sign.

var mystr = "hello";
document.write(mystr + "I love Java Script");//多项内容之间用+号连接

The fourth method: output HTML tags and work. The tags are enclosed in "".

var mystr="hello";
document.write(mystr+"<br>");//输出hello后，输出一个换行符
document.write("JavaScript");

Warning (alert message dialog box)

When we visit the website, sometimes a small window will pop up suddenly with a prompt message written on it. If you don't click "OK", you can't do any

operations on the web page. This small window is implemented using alert.

Syntax: alert(string or variable);

var mynum = 30;
alert("hello!");
alert(mynum);

Result: Pop up message boxes in order (the alert pop-up message dialog box contains an OK button)

Note:

1. No other operations can be performed before clicking the "OK" button in the dialog box.

2. The message dialog box can usually be used to debug the program.

3. alert output content can be a string or variable, similar to document.write

Confirm selection (confirm message dialog box)

In addition to providing information to the user, We also want to get information from our users. The confirm message dialog box is used here.

confirm message dialog box is usually used to allow the user to make a choice, such as: "Are you right?" etc. Pops up a dialog box (including an OK button and a Cancel button).

Syntax: confirm(str);

Parameter description: str: The text to be displayed in the message dialog box Return value: Boolean value

Return value:

When the user clicks the "OK" button, return true

When the user clicks the "Cancel" button, return false

Note: The return value can be used to determine which button the user clicked

<script type="text/javascript">
  var mymessage=confirm("你喜欢JavaScript吗?");
  if(mymessage==true){
    document.write("很好,加油!");
  }else{
    document.write("JS功能强大，要学习噢!");
  }
</script>

Ask a question (prompt message dialog box)

Sometimes, not only do you want the user to answer Yes/No. Rather, expect a more specific response. In this case we can use prompt.

prompt pops up a message dialog box, usually used to ask for some information that needs to be interacted with the user. Pops up a message dialog box (including an OK button, a Cancel button and a text input box).

Syntax:

prompt(str1,str2);

Parameter description:

str1: Text to be displayed in the message dialog box, cannot be modified

str2: Text The content in the box can be modified

Return value:

1. Click the OK button, and the content in the text box will be used as the function return value

2. Click the Cancel button, Will return null

function rec(){
  var score; //score变量，用来存储用户输入的成绩值。
  score = prompt("请输入你的成绩","90");
  if(score>=90){
    document.write("你很棒!");
  }else if(score>=75){
    document.write("不错吆!");
  }else if(score>=60){
    document.write("要加油!");
  }else{
    document.write("要努力了!");
  };
} ;

<script>
    var myName = prompt("输入您的名字");
     if(myName != null && myName != ""){
      document.write("welcom to" + myName);
    }else{
      document.write("welcom to my friend");
    }
</script>

Open a new window (window.open)

Syntax:

window.open([URL], [窗口名称], [参数字符串])

Parameter description:

URL: Optional parameter, the URL or path of the web page to be displayed in the window. If this parameter is omitted, or its value is an empty string, no document will be displayed in the window.

Window name: Optional parameter, the name of the opened window.

1. The name consists of letters, numbers and underscore characters.

2. Window name: Optional, this string is a comma-separated list of characteristics that declares the name of the opened window. Can

是"_top"、"_blank"、"_selft"、"_parent"等。

_blank 在新窗口显示目标网页

_selft 在当前窗口显示目标网页

_parent 框架网页中当前整个窗口位置显示目标网页

_top 框架网页中在上部窗口中显示目标网页

3.相同 name 的窗口只能创建一个，要想创建多个窗口则 name 不能相同。

4.name 不能包含有空格。

参数字符串：可选参数，设置窗口参数，各参数用逗号隔开。

参数表：

top　　　　Number　　窗口顶部离开屏幕顶部的像素数
left　　　　Number　　窗口左端离开屏幕左端的像素数
width　　　　Number　　窗口的宽度
height　　　　Number　　窗口的高度
menubar　　　　yes,no　　窗口有没有菜单
toolbar　　　　yes,no　　窗口有没有工具条
scrollbars　　　　yes,no　　 窗口有没有滚动条
status　　　　　　yes,no　　 窗口有没有状态栏

<script type="text/javascript">
   window.open(&#39;http://&#39;,&#39;_blank&#39;,&#39;width=300,height=200,menubar=no,toolbar=no, status=no,scrollbars=yes&#39;)
 </script>

关闭窗口（window.close）

close()关闭窗口

用法：

1 window.close();//关闭本窗口
2 <窗口对象>.close();//关闭指定的窗口

例如:关闭新建的窗口。

1 <script type="text/javascript">
2   var mywin=window.open(&#39;http://www.jb51.net&#39;); //将新打的窗口对象，存储在变量mywin中
3   mywin.close();
4 </script>

innerHTML属性

innerHTML属性用于获取或替换HTML元素的内容。

语法：

Object.innerHTML

Object是获取的元素对象，如通过document.getElementById("ID")获取元素。

<h2 id="con">javascript</H2>

<script type="text/javascript">
　　var mychar=document.getElementById("con");
　　document.write("原标题:"+mychar.innerHTML+"<br>"); //输出原h2标签内容
　　mychar.innerHTML="hello world"
　　document.write("修改后的标题:"+mychar.innerHTML); //输出修改后h2标签内容
</script>

改变HTML样式

语法：

Object.style.property=new style;

注意：Object是获取的元素对象，如通过document.getElementById("id")获取的元素

<h2 id="con">I love JavaScript</h2>

<script type="text/javascript">
  var mychar= document.getElementById("con");
  mychar.style.color="red";
  mychar.style.background="#ccc";
  mychar.style.width="300px";
</script>

显示和隐藏（display属性）

语法：

Object.style.display = value

value值：

none 此元素不会被显示（及隐藏）

block 此元素将显示为块级元素（即显示）

mychar.style.display = "block"

控制类名（className属性）
className属性设置或返回元素的class属性。
语法：

object.className = classname

作用：
1、获取元素的class属性
2、为网页内的某个元素指定一个css样式来更改该元素的外观

p2.className = "two";

以上这篇Javascript基础学习笔记(菜鸟必看篇)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持PHP中文网。

更多Javascript基础学习笔记(菜鸟必看篇)相关文章请关注PHP中文网！