前端基础知识总结(一)

友友们,,我又来了,这几天课比较紧,我把自己遇到的一些小问题总结了一下,希望对你们有用。。

HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。

getElementById(id) - 获取带有指定 id 的节点(元素)

appendChild(node) - 插入新的子节点(元素)

removeChild(node) - 删除子节点(元素)

innerHTML - 节点(元素)的文本值

parentNode - 节点(元素)的父节点

childNodes - 节点(元素)的子节点

attributes - 节点(元素)的属性节点

改变元素内容的最简答的方法是使用 innerHTML 属性。

这里有两个特殊的属性,可以访问全部文档:

document.documentElement - 全部文档

document.body - 文档的主体

第二个就是相对于浏览器,屏幕显示的页面的宽高度。总结如下:

scrollWidth 是对象的实际内容的宽,不包边线宽度,会随对象中内容的多少改变(内容多了可能会改变对象的实际宽度)。

clientWidth是对象可见的宽度,不包滚动条等边线,会随窗口的显示大小改变。

offsetWidth是对象的可见宽度,包滚动条等边线,会随窗口的显示大小改变。

offsetWidth的值总是比clientWidth的值大。

clientWidth是对象看到的宽度(不含边线)

offsetWidth是对象看到的宽度(含边线,如滚动条的占用的宽)

clientWidth是对象看到的宽度(不含边线,即border)

scrollWidth是对象实际内容的宽度(若无padding,那就是边框之间距离,如有padding,就是左padding和右padding之间距离)。

offsetWidth是指对象自身的宽度,整型,单位像素(含边线,如滚动条的占用的宽,值会随着内容的输入而不断改变)。

scrollHeight: 获取对象的滚动高度。

scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离

scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离

scrollWidth:获取对象的滚动宽度

offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度

offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置

offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置

易混淆点:

clientX 设置或获取鼠标指针位置相对于当前窗口的 x 坐标,其中客户区域不包括窗口自身的控件和滚动条。

clientY 设置或获取鼠标指针位置相对于当前窗口的 y 坐标,其中客户区域不包括窗口自身的控件和滚动条。

offsetX 设置或获取鼠标指针位置相对于触发事件的对象的 x 坐标。

offsetY 设置或获取鼠标指针位置相对于触发事件的对象的 y 坐标。

screenX 设置或获取获取鼠标指针位置相对于用户屏幕的 x 坐标。

screenY 设置或获取鼠标指针位置相对于用户屏幕的 y 坐标。

x 设置或获取鼠标指针位置相对于父文档的 x 像素坐标(亦即相对于当前窗口)。

y 设置或获取鼠标指针位置相对于父文档的 y 像素坐标(亦即相对于当前窗口)。

好了,今天就这么点内容,希望对你们有用,上了一中午课,下午还要继续做项目,,这几天忙的上火。牙疼。大家在工作的时候要适当的放松,还有就是秋天了,天气慢慢转凉,记得及时添加衣物。。吃饭了。。

你可能感兴趣的:(前端基础知识总结(一))