JS高级笔记

最新推荐文章于 2024-07-12 16:27:40 发布

Muzzneo_

最新推荐文章于 2024-07-12 16:27:40 发布

阅读量89

点赞数 1

文章标签： javascript html5 html

本文链接：https://blog.csdn.net/Muzzneo/article/details/119819617

版权

这篇博客详细介绍了JavaScript的高级用法，包括获取元素内容、图片数组标签、窗口滚动操作、元素几何尺寸、事件处理、重绘与回流等知识点，深入探讨了事件对象、表单操作、事件响应链和事件代理等概念，还涉及到了BOM和jQuery的基本应用。

摘要由CSDN通过智能技术生成

2021-08-19

innerHtml：

设置元素内部的html融入会把以前的内容覆盖掉

可以识别字符中的标签语法

innerTest：

获取元素内部的文字，包括后代元素里的元素内容，重新赋值表示将原来的内容替换

不能识别字符串中的标签

指定位置：window.scrollTo（x，y）；指的是滚动到窗口的x，y坐标的位置

window.onclick=function(){
            window.scrollTo(0,500);
        }

window.scrollBy（0,30）；指的是滚动当前位置再加减（0,30）的距离

window.onclick=function(){
            window.scrollBy(0,300);
        }

scrollIntoView（true/false）

let myget = document.querySelector(".box1");
        window.onclick=function(){
            myget.scrollIntoView();//传参：默认true
        }

true：元素的上边缘和窗口对齐

fasle：元素的下边缘和窗口对齐

获取x方向位置：window.pageXOffset

window.onclick=function(){
            console.log(window.pageXOffset);
        }

获取y方向位置：window.pageYOffset

window.onclick=function(){
            console.log(window.pageYOffset);
        }

部分存在兼容问题：

获取距离水平方向距离：document.body.scrollLeft

获取距离垂直方向距离：document.body.scrollTop

getBoundingClientRect（）

关注