js精简版

单于越
2023-12-01

                                                                                                       js

1.      查找元素:

Document.getElmengByid(“id名”);返回结果只有一个。

Document.getElmentsByname(“name名”);返回数组型。

Document.getElmentsByTagname(“name名”);返回数组型。

Document.getElmentsByclassname (“name名”);返回数组型。

2.      获取和设置元素属性值:

如需要获取img的属性值:

获取:Img.getAttribute(“属性名”);

设置:var img = Img.setAttribute(“属性名”,”属性值”);

3.      点符号法优化setAttribute:

Img.属性名 = “属性值”。

多个属性的定义,通过点符号法实现比较麻烦,需要一个个定义。

4.      CSSText优化点符号法:

Text.style.csstext = “ 属性名:属性值;属性名:属性值;”

优点:可以多个属性值一起定义。

5.      classname优化:

text.style += “ classnstyle”;再通过在<style>中设置样式。

总结:cssText和className方法都是以覆盖的形式进行样式的添加
 在使用这两种方法的时候,需要注意+= ”;样式“或者+=” 样式类“来进行最加

6.      获取行内样式和行外样式的方法:

方法1:行类样式:

 通过.style获取行内样式,这种方法不能获取到行外样式

text.style.color ="yellow"有赋值操作是对样式进行设置

text.style.color 没有赋值操作,是对样式进行获取

方法2:行内及行外获取样式:

window.getcomputedstyle:w3c标准提供的方法,凡是符合w3c标准的浏览器都可以用来获取样式。window.getComputedStyle(text).color
      element.currentStyle:非w3c的浏览器获取样式的方法

text.currentStyle.color

7. 查找节点:

父元素查找子元素:fristchildfristElementchild),lastchildlastElementchild),childrenownerdocument

子元素查找父元素:parentNode

同级元素的查找:previousiblingpreviousElementsibling)查找前一个节点,nextsiblingnaxtElemetsibling)查找后一个节点。

8. 节点的增加:createElement;

节点的克隆:cloneNodeturn/flase);

节点移除:removechild(移除元素名)

节点替换:replacechild(新元素元素名,被替换的元素名)

节点的追加:父元素.appendchlid(追加的元素名)把一个元素追加到父元素后面。

在元素前增加一个元素:insertbefore(新元素名,在那个元素前插入)

9. 增加行:insertrow

增加列:insertcell

10.    鼠标事件:click,dbclick,mouseover,mouseout,mousedown,mouseup,mousemove.

11.    键盘事件:keydownkeypresskeyup

12.    HTML事件:

        文本事件:selectchangefocus

        表单验证:

        窗口事件:resize(窗口大小),scroll(滚动条)

 类似资料: