在 JavaScript 中闪烁文本

最新推荐文章于 2023-11-05 21:00:57 发布

小柴没吃饱

最新推荐文章于 2023-11-05 21:00:57 发布

阅读量399

点赞数

分类专栏： JavaScript 文章标签： javascript 开发语言

本文链接：https://blog.csdn.net/weixin_50251467/article/details/131775873

版权

JavaScript 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

[在 JavaScript 中使用 `window` 对象触发闪烁功能]

我们将使用 window 对象的 addEventListener 方法来触发 load 事件。我们将设置闪烁的间隔，这里 1000 表示 1 秒。

这意味着它将在页面上保留文本一秒钟并消失一秒钟并重复。

代码片段：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <div id="blink">Blink with window object</div>
  <script>
  window.addEventListener("load", function() {
    var b = document.getElementById('blink');
    setInterval(function() {
        b.style.display = (b.style.display == 'none' ? '' : 'none');
    }, 1000);
}, false);
  </script>
</body>
</html>

输出：

使用 window 对象触发闪烁功能

[在 JavaScript 中使用 `onload` 属性设置闪烁功能]

onload 属性通常添加在 body 元素中，每当文件在运行时，onload 函数首先被触发。因此，函数 blink() 已经定义了所有必要的声明，并且闪烁的文本执行了它的工作。

代码片段：

<html>
<body onload="blink();">
  <div id="blink">Blink on onload</div>
  <script>
  function blink() {
   var b = document.getElementById('blink');
   setInterval(function() {
      b.style.display = (b.style.display == 'none' ? '' : 'none');
   }, 1000);
}
  </script>
</body>
</html>

输出：

使用 onload 属性设置闪烁功能

[在 JavaScript 中使用 jQuery `ready()` 函数闪烁文本]

jQuery ready() 事件仅在加载窗口时起作用。因此，该函数将在每次加载时声明它的作用。

setInterval 函数将更改显示的间隔，因此该函数将产生闪烁效果。

代码片段：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>test</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-1.6.4.js"></script>
  <script>
  $(document).ready(function() {
    var b = document.getElementById('blink');
    setInterval(function() {
        b.style.display = (b.style.display == 'none' ? '' : 'none');
    }, 1000);
});
  </script>
<div id="blink">Blink with jQuery</div>
</body>
</html>

输出：

使用 jQuery 的 ready() 函数来闪烁文本

小柴没吃饱

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
打赏
0
评论
在 JavaScript 中闪烁文本

事件仅在加载窗口时起作用。因此，该函数将在每次加载时声明它的作用。我们将设置闪烁的间隔，这里 1000 表示 1 秒。已经定义了所有必要的声明，并且闪烁的文本执行了它的工作。这意味着它将在页面上保留文本一秒钟并消失一秒钟并重复。函数将更改显示的间隔，因此该函数将产生闪烁效果。元素中，每当文件在运行时，
复制链接

扫一扫