Javascript在文本的循环中隐藏并显示div；眨眼；效应

我最近想在一个div中创建一个ID为“test”的元素，使其具有像大多数文本编辑器一样的“闪烁”效果，其中光标被隐藏，然后显示，然后隐藏，然后显示……（在循环中）我试图重新创建此效果，但无法使其工作。请帮忙

下面是一些代码：

_

像这样的东西

setInterval(function(){
     $("#test p").toggle();
},3000);

每3秒闪烁一次。

（虽然会阻止内容四处移动，所以我建议这样做。）

---

（包括切换可见性，而不是“显示”，这将防止内容四处移动。）

这里有一种简洁、纯JavaScript的方法

blink = setInterval(function () {
  element = document.querySelector("#test p");
  element.style.opacity = (element.style.opacity == 1 ? 0 : 1);
}, 500);

如果要停止，请运行

clearInterval（闪烁）

这是一个例子。

---

下面是一个使用jQuery和setInterval的示例

$(".crsr").each(function(){
    var elem=$(this);
    setInterval( function() {
        if(elem.css('visibility')=='hidden') {
            elem.css('visibility','visible')
        } else {
            elem.css('visibility','hidden')
        }
    },500)
});

---

把我的方法扔进拳击场。：）设置一个类，将

可见性

更改为

隐藏

，然后使用

设置间隔

和

切换类

来关闭和打开该类

HTML

<div id="blinkingText">
    Blink for me!
</div>

为我眨眼！

CSS

<style>
    .blinkOn {visibility: hidden;}
</style>

<script type="text/javascript">
    $(document).ready(function(){
        setInterval(function() {
            $("#blinkingText").toggleClass("blinkOn");
        },1000);
    });
</script>

.blinkOn{可见性：隐藏；}

JS

<style>
    .blinkOn {visibility: hidden;}
</style>

<script type="text/javascript">
    $(document).ready(function(){
        setInterval(function() {
            $("#blinkingText").toggleClass("blinkOn");
        },1000);
    });
</script>

$（文档）.ready（函数（）{
setInterval（函数（）{
$（“#blinkText”）.toggleClass（“blinkOn”）；
},1000);
});

那么

标签呢？

已经被弃用了：（而且浏览器支持非常差）发布一些js代码怎么办？@ChrisB-这是一个笑话，甚至还有一个javascript解决方案，所以这应该很容易理解。看到这一点，它将帮助你非常感谢你的帖子！它成功了！！（我对网络编程有点陌生）很高兴它有帮助！如果这个答案满足要求，请将其标记为已接受并关闭线程，谢谢！注意：这也将删除

标记提供的任何大小调整，因为它使用

显示

样式。如果您希望布局保持不变，但可见性可以打开或关闭，则需要使用一些更改

可见性的内容

style.True，在这种情况下，您可以执行，

setInterval（function（）{if（$（'test p'）.css（'visibility'）=='hidden'）$（'test p'）.css（'visibility'，'visibility'）；else$（'test p'）.css（'visibility'，'hidden'）；）3000）

谢谢您的提醒！不客气。您有了更优雅的JS解决方案：）

<script type="text/javascript">
    $(document).ready(function(){
        setInterval(function() {
            $("#blinkingText").toggleClass("blinkOn");
        },1000);
    });
</script>