如何在JavaScript中向选定的类中递增添加数字

How can I incrementally add a number to a selected class in JavaScript?

本文关键字：数字 添加 JavaScript      更新时间：2023-09-26

我正在使用Drupal动态生成内容。我运行的javascript将一个div放在另一个div之前。代码运行良好，如下所示：

  $(function() {
    $('.views-row-1 .content .body').insertBefore('.views-row-1 .content .field-name-field-image-one');
   });

我的问题是，因为内容是动态生成的，所以类"viewsrow-#"的变化是递增的。例如，如果我在页面上有3个内容元素，Drupal将为第一个创建类views-row-1，为第二个创建views-row-2，为第三个创建views-crow-3。

我所做的（这并不理想）是为每一条内容写下一行代码，如下所示：

  $(function() {
    $('.views-row-1 .content .body').insertBefore('.views-row-1 .content .field-name-field-image-one'); // check before() examples
    $('.views-row-2 .content .body').insertBefore('.views-row-2 .content .field-name-field-image-one'); // check before() examples
    $('.views-row-3 .content .body').insertBefore('.views-row-3 .content .field-name-field-image-one'); // check before() examples
    $('.views-row-4 .content .body').insertBefore('.views-row-4 .content .field-name-field-image-one') 
   });

我永远不知道会有多少条内容，因为它是动态的，所以我希望让javascript将数字添加到类中。这可能吗？

$('[class^="views-row"]').each(function(){
    var className = //get classname to insert before 
   //not sure if .index() will help you since you have not posted your HTML
   $(this).find('.content .body').insertBefore(className);
});

为每一行添加一个特定的类，在这里称之为"divAppend"。

然后执行：

$('.divAppend').each(function() {
    $(this).insertBefore('whateveryouareinserting');
});

您可以尝试以下操作：

function iterate () {
    var view = null;
    var i = 1;
    while ((view = $('.views-row-' + i + ' .content .body')).size() > 0) {
        alert(view.text());
        view.insertBefore('.views-row-' + i + ' .content .field-name-field-image-one');
        i++;
    }    
}
$(function() {
    iterate();
});
​

虽然它一点也不漂亮，但它很管用。这是小提琴。​

我最终使用了它，因为Drupal还为每一段内容创建了类"视图行"。感谢所有的帮助，尽管，许多创造性和有用的解决方案！

$('.views-row').each(function(i,e) {
  $('.content .body', e).insertBefore($('.content .field-name-field-image-one', e));
});
相关文章：