使用js循环的方式批量控制元素的大小时结果往往不尽如人意。

我总结了一条规律

在一个循环体内不可以同时存在一下两种操作，否则容易导致元素错位或大小改变：

1.对元素的offsetWidth、offsetHeight等与大小、位置有关的属性的访问

2.对元素的移动、改变大小（包括可能间接导致元素移动和改变大小的操作，例如创建插入或删除字符/节点、将其移动到另一个父容器中等）

如果有的话，将其拆分成两个循环才行。

至于为什么，在循环体内插入一个alert（“”），然后运行一下你就知道了

js操作元素导致元素错位和大小改变的更多相关文章

  1. 在js中获取页面元素的属性值时,弱类型导致的诡异事件踩坑记录,

    前几天写一个js的时候遇到一个非常诡异的事情,这个问题是这样的,我要获取一个页面的DOM元素的val值,判断这个值是否比某个变量大,这个需求原先数字最大也就是10,现在要改了,可能会更多,这个时候我发 ...

  2. selenium常用操作，查找元素，操作Cookie，获取截图，获取窗口信息，切换，执行js代码

    目录: 1. 常用操作 2. 查找元素 3. 操作Cookie 4. 获取截图 5. 获取窗口信息 6. 切换 7. 执行JS代码 简介 selenium.webdriver.remote.webdr ...

  3. JS操作iframe元素

    1.  demo1.html页面中有个iframe元素,iframe元素的src是iframe1.html,怎么在demo1.html页面中操作iframe1.html页面 答曰:demo1.html ...

  4. js操作：selenium无法操作隐藏元素问题

    对于前端隐藏元素,一直是selenium自动化定位元素的隐形杀手,脚本跑到隐藏元素时位置时报各种各样的错误, 隐藏的下拉菜单又没有办法避免,此帖只为交流隐藏元素自动化定位处理方法(3种操作)      ...

  5. Selenium with Python 005 - 调用js操作页面元素

    WebDriver提供了execute_script()方法来执行JavaScript方法,格式如 driver.execute_script(script,*args) 执行js一般有两种场景,一是 ...

  6. JS/jQuery--iframe框架内外元素的操作（转）

    JS/jQuery--iframe框架内外元素的操作 原创 2017年12月07日 14:23:09 标签: js / iframe 28 两个问题: 如何在父页面操作iframe框架内的元素? 如何 ...

  7. webdriver与JS操作浏览器元素

    1.JQuery的选择器实例 语法 描述 $(this) 当前 HTML 元素 $("p") 所有 <p> 元素 $("p.intro") 所有 c ...

  8. vue.js操作元素属性

    vue动态操作div的class 看代码: <!doctype html> <html lang="en"> <head> <meta c ...

  9. selenium中元素操作之浏览器窗口滚动&网页日期控件操作（js操作）（五）

    js的滚动条scrollIntoView() Arguments[] - python与js之间的羁绊 1.移动到元素element对象的“底端”,与当前窗口的“底部”对齐: driver.execu ...

随机推荐

  1. c++程序—三目运算符

    #include<iostream> using namespace std; #include<string> int main() { //三目运算符 ; ; ; c = ...

  2. zoj 2314Reactor Cooling

    秘制神奇上下界网络流%%% 什么什么有(木)源汇可行流什么的,,看不懂(一下纯属个人sb言论) 看了半天知道点,一个点u,从S连到u的流量是全部流入u的下界,u到T是全部流出u的下界和.(进去出来的约 ...

  3. 实现VR直播的关键技术

    VR是多媒体技术发展的必然趋势,人们所使用的信息载体从最早的文字.图像,到音视频,再到用VR,将事物的描述表达推向了极致,充分满足了沉浸性.互动性和构想性三大要素的需求.随着5G的商业化运营,VR有望 ...

  4. odoo 日志文件太大处理,logfile自动轮替

    可以在conf 文件中设置配置信息: logfile = /your/logfile/path/ logrotate = True ; 设置为True 即可自动更换旧的日志文件, 参考: https: ...

  5. JavaWeb之监听器

    1. 介绍         监听器是一个专门用于对其他对象身上发生的事件或状态改变进行监听和相应处理的对象,当被监视的对象发生情况时,立即采取相应的行动.监听器其实就是一个实现特定接口的普通java程 ...

  6. POJ 3126：Prime Path

    Prime Path Time Limit: 1000MS   Memory Limit: 65536KB   64bit IO Format: %I64d & %I64u Submit St ...

  7. POJ 3050：Hopscotch

    Hopscotch Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 2506   Accepted: 1784 Descrip ...

  8. idea 2019.3 最新破解补丁和激活码，可破解至2089年！

    链接:https://blog.csdn.net/qq_42914528/article/details/85617901 上面方法失效了,请尝试以下方式激活(2020.1.6更新) idea激活码( ...

  9. M内核迎来大BOSS，ARM发布Cortex-M55配NPU Ethos-U55 ，带来无与伦比的性能提升

    说明: 全球顶级嵌入式会展Embedded Word2020这个月底就开了,各路厂家都将拿出看家本领. 先回顾下去年的消息: 1.去年年初的时候ARM发布Armv8.1-M架构,增加了Arm Heli ...

  10. 关于win10 使用eclipse如何配置环境变量

    关于环境变量的配置,在百度上有很多教程,但对于我来说完成这步操作确实不简单,所以决定在这里分享一下配置方法. 1.安装好jdk/jre.  官网都有安装文件,仔细一些,就能安装成功,可以自定义安装路径 ...