Hare's JS learning notes - merging and updating

The words written in the front

I haven't learned about js systematically before, but I only have a fragmented understanding of js. This time I will try to learn about it step by step.

Classroom Notes 1

The following is what we learned today. They are very simple introductions, so they are called Introduction 1. It is expected to complete all the contents of the introductory chapter in two days.

1. Basic content:

Insert js

<script type = “text/javascript”>
//jscode
<script>

Reference external js file

<script src=”myjs.js”> <script>
//There is no need to write<script>tags in the js file. Write code directly.

Position of js in the page

Execute in sequence.

Statements and symbols
notes

Single row//
Multiple lines/**/

variable

var a = 1;
//Use var to define, and the type will be automatically declared as a data type.

Judgement statement

if(boolean){
//jscode
}
else{
//jscode
}

function

function myFun1(){
/jscode
}
//Use the function function name () {} to define the function. Call by writing the function name () in the corresponding place.

2. Common simple methods

Document. write (string/variable, etc., use+connection)
//It is used to directly write content to the html output stream.

Alert ([str]) warning message dialog
//Warning: A single button dialog box pops up. At this time, do not execute the following content, and wait for the user to click the button. monopoly.

Confirm ([str]) confirmation message dialog
//Str is the display content. The return value of this method is boolean. Click OK to return true.

Prompt ([str1], [str2]) question message dialog
//Str1 is the title content, which cannot be modified by the user. str2 is the content displayed by default in the edit box, which can be modified by the user. After the user confirms, this value is returned.

Window. open ([url], [name], [specs], [replace]) method opens a new window
//Name specifies the target attribute or the name of the window, and specs specifies some parameters, such as full screen, width, and height.

Window. close() method
//Close the page, for example, windows. close() closes the current page, and mypage. close() closes the mypage page.

 

Classroom Notes 2

Today is the second day of self-study of JavaScrit. I have basically completed the introductory content.

1. Give me control!

DOM: Document Object Model.

When parsing html documents with DOM, first build a complete parse tree in memory, that is, all elements in html are parsed into hierarchical nodes on the tree, and then you can perform operations on these nodes.

Get Element/Element Group

Get element by id
document.getElementById(id);
//For example, var element1=document. getElementById ("id1");

Get element group through tagname

document.getElementsByTagName(tagname);
//If it is *, match all elements.
//String is case insensitive

Get element group through name

document.getElementsByName(name);
Although you can use document. getElementsByTagName (tagname) [3]; Get the fourth tagname element, but it is recommended to use id

Control Style

With the above method of obtaining elements (groups), the following can naturally control the style.
Text between element tags: obj.innerHTML;
Background color: obj. style. backgroundColor;
//Note that the element does not have a background color attribute, only a style attribute, and the background color attribute is a style attribute.
Color: obj.style.color;
Width: obj.width;

... There are many others, let's not talk about them.

Set whether to display

Set whether to display the element by setting the value of the display attribute of style
For example, obj.style.display="none"// Do not display
obj.style.display = “block”; // Block display

Control class name

The className attribute of the element controls or returns the class attribute of the element.
For example: obj.className="div2";

2. Precautions
It is better to have only one ID for the same ID, otherwise there will be many problems
When using the id to control the css style, pay attention to the impact on changing the style.

Classroom Notes 3

Today is the third day of learning js. I didn't read much because of some small things.

1. Operator

Commutation usage of logical operators (Trick or treat!)

var a=5;b=6;
var result = a>b;
var result2 = ! (a>b);
//The result of result is false of boolean type
//The result of result2 is true of boolean type

Operator priority (like c++, c #)

Arithmetic operator>comparison operator>logical operator (| |,&&, etc.)>"=" assignment symbol

2. Array

One dimensional array

var myArr = new Array();
var myArr = new Array(66,80,90,77,59);
var myArr2 = [1,2,3];// Why does sbjs use [] qvq
var a = myArr[0]; // a = undefined
myArr2[3] = 5;
var b =myArr2.length; // ->a = 4

Two dimensional array (I suddenly remembered the nightmare of sawtooth array)

var myArr = [[1,2,3],[4,5,6]];
var myArr1 = new Array();
myArr1[0] = Array();
myArr1[0][0] = 1;

References

1. [Head picture] [Picture] Mooc College JS learning