使用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. GetqueueStatus

    #include "stdafx.h" #include <Windows.h> #include <process.h> #include <ios ...

  2. 六、SAP中以一个变量的形式来定义另一种变量

    一.代码如下: 二.输出

  3. 吴裕雄--天生自然C++语言学习笔记：C++ 数据类型

    使用编程语言进行编程时,需要用到各种变量来存储各种信息.变量保留的是它所存储的值的内存位置.这意味着,当创建一个变量时,就会在内存中保留一些空间. 可能需要存储各种数据类型(比如字符型.宽字符型.整型 ...

  4. MessageBox.Show的使用

    MessageBox.Show("内容","标题") // 摘要:// 使用指定的帮助文件.HelpNavigator 和帮助主题显示一个具有指定文本.标题.按 ...

  5. MySQL数据类型使用总结，浮点使用注意事项

    1.对于精度要求较高的应用中,建议使用定点数来存储数值,以保证结果的准确性. 2.对于字符类型,要根据存储引擎进行相应的选择 3.对含有TEXT和BOLB字段的表,如果经常做删除和修改记录的操作要定时 ...

  6. 洛谷 P2341 [HAOI2006]受欢迎的牛|【模板】强连通分量

    题目传送门 解题思路: 先求强联通分量,缩点,然后统计新图中有几个点出度为0,如果大于1个,则说明这不是一个连通图,答案即为0.否则入度为0的那个强连通分量的点数即为答案 AC代码: #include ...

  7. Java学生管理系统（IO版）

    图解: cade: student.java /* * 这是我的学生类 */ public class Student { //学号 private String id; //姓名 private S ...

  8. 墙壁涂色（DP）

    蒜头君觉得白色的墙面好单调,他决定给房间的墙面涂上颜色. 他买了 3 种颜料分别是红.黄.蓝,然后把房间的墙壁竖直地划分成 n 个部分,蒜头希望每个相邻的部分颜色不能相同. 他想知道一共有多少种给房间 ...

  9. 51nod A 魔法部落(逆元费马小定理)

    A 魔法部落 小Biu所在的部落是一个魔法部落,部落中一共有n+1个人,小Biu是魔法部落中最菜的,所以他的魔力值为1,魔法部落中n个人的魔法值都不相同,第一个人的魔法值是小Biu的3倍,第二个人的魔 ...

  10. 201771010123汪慧和《面向对象程序设计Java》第十一周实验总结

    一.理论部分 1.栈 (1)栈是一种特殊的线性表,是一种后进先出的结构.(2)栈是限定仅在表尾进行插入和删除运算的线性表,表尾称为栈顶,表头称为栈底.(3)栈的物理存储可以用顺序存储结构,也可以用链式 ...