Tag Archives: Js learning

How to Use DOM to operate CSS

    1. Modify styles through JS: the styles modified by this method are inline styles with high priority. However, if “! Important” is used in the style, the modification of JS will not work.
	Syntax: element.style.styleName = styleValue ;      
	The style value must be a string
	Note: If the style of css contains " - " , this name is not legal in JS, you need to change this style name to camel naming, remove the " - " and change the
	initial letter to uppercase.

Read style:

	Syntax: element.style.styleName

The styles set and read through the style property are inline styles

    1. get the display style of the current element:
	Syntax: element.currentStyle.styleName 
	currentStyle is only supported by IE browser

In other browsers, you can use the getcomputedstyle() method to get the current style of the element. This method is a window method and can be used directly. This method will return a style object that encapsulates the corresponding style of the current element.

	Two parameters are required
	The first: the element to get the style
	The second: you can pass a pseudo-element, which is usually null

Note: the styles obtained through currentstyle and getcomputestyle are read-only and cannot be modified. If you want to modify them, you must use the style property </OL> to modify them

The addition, deletion and modification of DOM in JS Foundation

    1. document.createElement (); you need to pass in a tag name as a parameter. You will create a corresponding node according to the tag name and return the node. document.createTextNode (); you need to pass in a text content as the parameter appendChild ()
	Usage: parent element.appendChild( child node ).

A child of a node can be inserted before the new node

	Usage: Parent node. insertBefore( new node, old node );

Replacechild(); replace child node

	Usage: parent.replaceChild( new node, old node );

Removechild(); can delete a child node

	Usage: parent.removeChild(child node).

InnerHTML can also be used to add dom. Generally, the two methods are combined.

	e.g. city.innerHTML += " <li>GuangZhou</li> ";

Confirm (“); a prompt box with confirm and Cancel buttons will pop up. If the user clicks confirm, it will return true; otherwise, it will return false </ OL>