Question

在使用奇怪的输出并将其转换为可读的剧本格式时遇到一些麻烦。

所以这是HTML。

<div>
<p class="actor">John</p>
<p class="line">I want to buy milk.</p>
<p class="actor">John</p>
<p class="line">Milk is expensive.</p>
<p class="dirNote">John grabs the milk</p>
<p class="actor">John</p>
<p class="line">I guess its fine.</p>
<p class="actor">Steve</p>
<p class="line">Yeah.</p>
</div>

我尝试解决这个问题已经失败了。但基本的想法是......

循环遍历p.actor的每个实例将第一个实例存储为var

检查下一个针对var

的实例

如果它们是相同的

将该实例的p.line的内容追加到var

的p.line中

否则替换var

使用新的p.actor

另外，如果遇到p.dirNote，p.actor的下一个实例会设置新的var

基本上完成时html应该看起来像这样

<div>
<p class="actor">John</p>
<p class="line">I want to buy milk. Milk is expensive.</p>
<p class="dirNote">John grabs the milk</p>
<p class="actor">John</p>
<p class="line">I guess its fine.</p>
<p class="actor">Steve</p>
<p class="line">Yeah.</p>
</div>

对可行性的任何想法？谢谢。

Answer 1

以下代码段应该有技巧。它基本上将集合转换为数组，并从集合中的最后一个元素开始。

$('p.actor').toArray().reverse().forEach(function (el) {
    var 
        $this = $(el), 
        $prev = $this.prev().prev('.actor'), 
        $line
    ;

    if ($this.text() !== $prev.text()) {
        return;
    }

    $line = $this.next('.line');
    $prev.next('.line').append(' ' + $line.text());
    $this.add($line).remove();
});

http://jsfiddle.net/j9qwzyzq/

Answer 2

我有一个半答案给你。它比我变得更加发展，所以我现在就停下来。

循环遍历段落，跟踪其类型并重建新列表。它仍然需要弄清楚如何跟踪前一个（或下一个）行/演员和addRow。希望它有所帮助...

var rows = $("#my-list p"),
newRows = [],
currentActor = null,
currentLine = null,
addRow = function (type, value) {
    newRows.push({
        type: type,
        value: value
    })
};

rows.each(function (index) {
    var $row = $(this),
        className = $row.attr("class"),
        isActor = className == "actor",
        isLine = className == "line",
        isDirNote = className == "dirNote",
        content = $row.text();

    if (isLine) {
        //TODO: keep track of line to be appended to next item (if same actor)
        //TODO: if next element is same actor, append line
        //addRow(className, content);
    }
    if (isDirNote || isActor) {
        addRow(className, content);
    }
    console.log(content, isActor, isLine, isDirNote);
})

console.log(newRows);

//TODO: build new paragraph array from newRows

Jquery：检查第一个实例

2 个答案: