javascript - 将数组元素替换为 id 标签

Question

假设数组中的元素是以下代码的 id 标记，但它在这里似乎不起作用。每次调用突出显示函数时，它都应该从先前的 id 标记中删除当前类，并且当前类应该指向充当 id 标记的下一个数组元素。

HTML 代码

<p class="current" id="one">Point 1</p>
<p id="two">Point 2</p>
<p id="three">Point 3</p>
<p id="four">Point 4</p>
<p id="five">Point 5</p>
<p id="six">Point 6</p>
<p id="seven">Point 7</p>

JAVASCRIPT 代码

//The array element is suppose to be the next id tag  and it should keep replacing as the function is called.
function highlight() {
    var point = ["one", "two", "three", "four", "five", "six", "seven"];

    var i = 0;

    $("#point[i]").removeClass("current"); //#point[i] doesn't seems to replace this thing

    i++
    if (i > 6) {
        i = 0;
    }

    $("#point[i]").addClass("current");

}
setTimeout(highlight, 5000);

Answer 1

你不能简单地这样做吗？

(function highlight() {
    setTimeout(function() {
        var $current = $("p.current").removeClass("current");
        var $next = $current.next().length && $current.next() || $current.siblings().first();
        $next.addClass("current");
        highlight();
    }, 1000);
}());

(function highlight() {
    setTimeout(function() {
        var $current = $("p.current").removeClass("current");
        var $next = $current.next().length && $current.next() || $current.siblings().first();
        $next.addClass("current");
        highlight();
    }, 1000);
}())

.current {
    color: green;
    font-weight: bold;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <p class="current" id="one">Point 1</p>
  <p id="two">Point 2</p>
  <p id="three">Point 3</p>
  <p id="four">Point 4</p>
  <p id="five">Point 5</p>
  <p id="six">Point 6</p>
  <p id="seven">Point 7</p>
</div>