DAY16 Js+dom

Source: Internet
Author: User

Icon website Http://

<i class= "fa fa-sort" aria-hidden= "true" ></i>



anonymous functions

Self-executing function creates a function and executes automatically

(function (ARG) {formal parameter

Console.log (ARG);

}) (1) Arguments

Serialization of String variables

Json.stringify () serialization resolves a string from an object

Json.parse () Parses a JSON object in an inverse-order string


-encodeURI () escape character in Uri

-decodeURI () characters that are not escaped from the URL

After the data has been escaped, it is saved in a cookie

val = eval (expression)


var d = new Date ()

D.getminutes ()

D.setminutes ()


The scope is a collection of accessible variables, objects, and functions .

The JavaScript variable life cycle is initialized when it declares.

Local variables are destroyed after the function has finished executing.

Global variables are destroyed after the page is closed.

    1. Take a function as a scope

    2. The scope of the function is created before the function is called.

    3. The scope of a function exists in the scope chain, and is also created before it is called: Find their own first, they did not find a layer, no longer look for the outer layer.

    4. Local variables within a function are declared in advance and are not assigned

function func () {

var xo = ' Hequan ';

function inner () {

Console.log (XO);


return inner;


var ret = func ()

RET ()


function func () {

Console.log (XO);

var xo = "Hequan";


Func ()


Object oriented

function foo (n) {;

this.sayname = function () {

Console.log (



var obj1 = new Foo ("HQ")

Obj1.sayname ()


function Foo (n) { = n;


Foo.prototype = {

'sayname':function () {

Console.log (



Obj1 = new Foo (' we ');

Obj1. Sayname ()


Direct Lookup

var obj = document.getElementById (' I1 ')

Indirect lookup

InnerText text

innerHtml Full Content

Obj.value Get Value

Style actions

. className

. classlist.add. Remove

. style.color

Property manipulation

Obj.setattribute ("attribute", "value")

Create tags and add to HTML


insertAdjacentHTML ("BeforeEnd", obj)

How objects are

Document.createelement (' div ')

Submit Form

Document.geelementbyid (' form '). Submit ()


Console.log Output Box

Alert Pop-up box

Confirm the Confirm box returns true False

URL and Refresh

Location.href Get URL

location.href = "url" redirection

Location.reload () Reload


SetInterval Multiple Timers

Clearinterval Clear Multiple Timers

SetTimeout Single Time Timer

Cleartimeout Clear one-time timer



document.getElementById get a label by ID

Document.getelementsbyname get a collection of tags based on the Name property

Document.getelementsbyclassname get a collection of tags based on the class property

document.getElementsByTagName get a collection of tags by tag name

Two ways to bind events:

Direct binding onclick= "XX ()"

Get the DOM object first and then bind

<div id = ' Test ' ><button type= "button" >click me!</button></div>


var mydiv = document.getElementById (' Test ')

Console.log (MYDIV)

Mydiv.onclick = function () {

Console.log (' Asdw ');



This is the label of the current trigger event

The first method of binding

Onclick= "Chang (This)"

function Chang (self) {

Self-currently clicked label


The second way of binding

<input id= ' i1 ' type= ' button ' >

document.getElementById (' I1 '). onclick = function () {

The current clicked label of this generation


This article is from the "what-all" blog, please be sure to keep this source

DAY16 Js+dom

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.