使用 Javascript 更改元素的位置

2023-12-02

这应该会在每次循环时将段落(带有 id 'Text')的位置更改为更向右。但它不起作用,我不知道如何解决它,所以如果有人可以帮助我,我会很高兴。先感谢您。

  var x = 0;

  d.style.position = "absolute";

  function myLoop () {
    setTimeout(function () {
      x += 10;
      document.getElementById('Text').style.left = x+'px';
      myLoop();
    }, 100)
  }

(这就是脚本中的所有内容)


你这里有两个问题。

1)你从未定义过d。这会导致脚本立即停止而不执行下一行代码。

2)你从未打过电话myLoop()功能。

所有更正也是如此。

var x = 0;
var d = document.getElementById('Text');
d.style.position = "absolute";
myLoop();
  function myLoop () {
    setTimeout(function () {
      x += 10;
      d.style.left = x+'px';
      myLoop();
    }, 100)
  }
<div id="Text">Test </div>

除了这个解决方案之外,您可能还需要看看 setInterval 函数,它会稍微减少您的代码。

var x = 0;
var d = document.getElementById('Text');
d.style.position = "absolute";
myLoop();
  function myLoop () {
    setInterval(function () {
      x += 10;
      d.style.left = x+'px';
    }, 100)
  }
<div id="Text">Test </div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 Javascript 更改元素的位置 的相关文章

  • d3 树 - 有相同孩子的父母

    我一直在将代码从 JIT 转换为 D3 并使用树布局 我已经复制了代码http mbostock github com d3 talk 20111018 tree html http mbostock github com d3 talk
  • 在生产中使用 css / javascript 源映射对性能有何影响?

    生产环境中应该使用源映射吗 除了调试之外 它们还有什么好处吗 由于额外的服务器往返 它们是否会影响应用程序加载时间 浏览器是否足够智能来加载 map应用程序加载和渲染后的资产 如果浏览器找不到 map asset 404错误 会对性能产生影
  • 在 ASP.NET MVC 中使用 bootstrap 创建模式

    我在 ASP NET MVC 项目上使用 NET Framework 4 5 Bootstrap v3 3 6 我想做的是创建一个模态表单 我尝试了以下方法 在主布局中创建了一个模态容器 div class modal fade style
  • CSS:响应式布局中的高度自动问题

    我在响应式布局中使用 jquery 延迟加载 并使用空白 gif 作为预览图像 为了使延迟加载工作 我必须通过属性设置图像的高度和宽度 预览图像未设置为正确的高度 因为 height auto 似乎是通过 src 而不是通过高度属性计算高度
  • 获取 Firebase AngularFire 中项目的索引 ID

    这里提出了类似的问题 但接受的答案并没有真正回答这个问题 使用 AngularFire 是否可以创建关系型数据库 或者访问 UniqueID https stackoverflow com questions 16879484 using
  • 有什么方法可以安全地在浏览器中显示视频

    有什么方法可以安全地在浏览器中显示视频 就像他的安全措施之一 视频无法下载 谢谢 我想您的意思是您不希望您的视频被下载或复制 如果是这样 那么阻止人们下载视频或多或少是不可能的 甚至有很多工具可以从 YouTube 等大型提供商那里下载 因
  • 使用 AngularJS $resource 进行 jsonp 请求

    我在 AngularJS 中定义了以下 2 个服务 两者都应该返回 JSONP 因为我正在进行跨域请求 服务A angular module ServiceA ngResource factory A function resource r
  • d3 序数尺度的映射

    我正在使用 D3 的序数比例将数字映射到颜色 我用过这个 color d3 scale ordinal range 1f77b4 ff7f0e 2ca02c d62728 9467bd 8c564b e377c2 domain 0 6 co
  • jQuery 删除函数真的删除 Dom 元素吗?

    我真的想知道 jQuery 是否remove http api jquery com remove 函数确实从 DOM 中删除元素 首先 我看了here https stackoverflow com questions 2185760 j
  • 在 Jscript 中实例化 System.Threading.Thread 对象

    我正在尝试使用 Jscript 创建一个新的 System Threading Thread 对象 但我无法让构造函数工作 如果我只是执行以下操作 var thread new Thread threadFunc function thre
  • ActiveX 日历控件在 Windows 7 中不起作用

    我们有一个经典的 ASP 应用程序 它使用以下日历对象
  • 需要将焦点放在react中的div上

    我有一个之前用 H1 标签包裹的文本 页面加载后 我需要专注于该文本 为了方便起见 我将它包装在 div 中 render const translate billing primaryContactSelection true this
  • 使用 System.js 导入 Typescript 编译的模块时出错

    我最近正在学习使用 system js 导入由 Typescript 编译的模块 这些模块之前是为 require js 编译的 并且工作正常 但是合并到system js时 应用时无法导入模块系统生产 js 控制台说 Uncaught i
  • 如何在纯 HTML 页面中返回特定的 HTTP 状态代码

    Google 建议当网站暂时不可用时返回 503 HTTP 响应 我有一些纯 HTML 网站 如何在纯 HTML 网站中返回 503 状态 我使用的是带有 Apache 的 Linux 机器 您必须在服务器上而不是在 HTML 文件中设置状
  • 在成功回调之前修改 JSONP 结果

    我想从外部服务加载一些 JSON 数据 然而 它提供 foo bar useful 而我真正关心的是 有用 的部分 我需要将那部分传递给success打回来 我正在尝试使用Deferred一次从多个数据源加载 类似this https st
  • 如何控制谷歌地图标记的不透明度

    我需要根据时间使一些标记半透明 有什么方法可以控制标记的 CSS 不透明度吗 或者是否可以可靠地找出标记的 DOM 元素 我使用 Google 地图 API v3 标记的不透明度可以设置为marker setOptions opacity
  • 如何使 CSS 动画/过渡以固定速度而不是固定持续时间播放? [复制]

    这个问题在这里已经有答案了 我有一个 CSS 动画 可以使元素沿直线移动未定义的距离 据我所知 动画具有固定的持续时间 因此无论元素必须移动多远 动画始终需要相同的时间来运行 我该如何制作才能使动画没有固定的duration 但有固定的运动
  • ExtJS:简单表单忽略 formBind

    我有一个小问题让我发疯了好几天 我有一个表单面板 Ext define EC view PasswordPanel extend Ext form Panel alias widget pwdpanel bodyPadding 15 ini
  • 如何创建浏览器插件?

    我必须创建一个插件 当用户将鼠标悬停在某些术语上时 该插件必须显示信息 谁能告诉我如何做的方向 我对创建插件没有太多想法 我知道我想要做的事情可以通过java脚本来完成 但是java脚本文件可以作为浏览器插件安装吗 任何对此的想法将不胜感激
  • 如何选中表格中输入文本焦点上的复选框

    我试图在输入文本焦点上检查表 DOM 中的复选框 但无法访问复选框元素 但我的焦点正在工作 这是我的 jsfiddle 链接https jsfiddle net 9qha9vft https jsfiddle net 9qha9vft 这是

随机推荐