4

我有一个可以工作的 jQuery 片段，但是为了改进我的 JS，我想要关于如何提高其效率的建议。

此功能缩短了 WordPress 摘录。它采用原始的 WordPress 摘录并提取前 40 个单词，这是我关心的部分。之后，它会在原始摘录的末尾添加“继续阅读”链接，并将其添加到截断版本的末尾。

同样，我只是想知道返回截断摘录的更快/更简洁的方法是什么。我尝试了“切片”并得到了一堆逗号。

jQuery('.page-id-7 .promo_slider_excerpt').each(function (i) {
    var s = jQuery(this).html();
    var sw = s.split(' '); // separate contents into array of words
    var t = [];
    var v;
    if (sw.length > 40) {
        var a = jQuery(this).children('a'); // this is the Continue Reading link
        for (v = 0; v < 40; v++) {
            t = (t + ' ' + sw[v]); // Build the shortened excerpt (this is the part I wanted to improve)
        }
        t = (t + ' ' + a[0].outerHTML); // Add the Continue Reading onto the end
        jQuery(this).html(t);
    } else {
        t = s;
        jQuery(this).html(t);
    }
});
4

2 回答 2

8

对于前四十个单词和继续阅读链接，我建议：

var s = jQuery(this).text(),
    fortyWords = s.split(' ').slice(0,39).join(' '),
    link = document.createElement('a'),
    linkText = document.createTextNode('continue reading');
link.href = 'http://path.to.article/';
link.appendChild(linkText);
$(this).text(fortyWords).append(link);

JS Fiddle 概念证明。

针对 OP 提出的进一步问题进行了编辑（在下面的评论中）：

1：Firebug 中有没有办法记录一种技术与另一种技术的效率？IOW：您的示例看起来不错，但是我可以将它的内存和速度与我的 for 循环进行比较吗？

我真的不知道，恐怕我根本不使用 Firefox，虽然我几乎只使用 Chromium，但我使用它的时间还不够长，无法发现用于内存使用或速度的分析工具。

但是，有JS Perf可以让您运行测试以显示特定方法的运行速度；尽管它根本没有涉及内存使用。

2：我的版本使用.html()方法和.outerHTML属性。我一直在网上看到这些帖子并不总是可靠的。这是IE6的一些保留吗？我的用户都是最新的，所以我想知道你为什么选择使用.text()然后附加一个节点？

html()是一种很好的使用方法，但理想情况下，仅当您想以字符串格式使用 html 时才使用；在上述情况下，使用字符串似乎更容易，因为我真正想要使用的是文本字符串。如果我正在操作的元素中还有其他元素text()，那么我必须使用，html()否则在将文本写入/替换到 DOM 时，这些元素将被覆盖。

我似乎记得在outerHTML历史上使用并坦率地说，在经验上没有取得太大成功。所以我很少考虑使用它，尽管这只是个人喜好问题。至于它是 IE 6 的遗留物吗？我不确定；我不会感到惊讶，但不幸的是，我根本不知道。

我选择使用text()，因为如前所述，我正在处理文本；然后我分别附加了节点，html()因为我正在插入一个 html 节点。如果我使用完全通过相同的内容，html()那么我认为它会起作用。但是，再次，只是个人喜好，我认为，它清楚地表明我是在操作/使用文本还是 html。

参考：

于 2012-06-07T17:31:30.983 回答
0

JQuery 不应该用于此。您可以根据需要使用过滤器修改摘录。让服务器完成工作：

remove_filter('get_the_excerpt', 'wp_trim_excerpt');
add_filter('get_the_excerpt', 'new_excerpt_format');
function new_excerpt_format($text)
{
    global $post;
    $raw_excerpt = $text;
    if(!$text)
    {
        $text = get_the_content('');
        $text = strip_shortcodes($text);
        $text = apply_filters('the_content', $text);
        $text = str_replace(']]>', ']]&gt;', $text);

        $exceptions = ''; //PRESERVE CERTAIN TAGS, ADD/REMOVE AS NEEDED (ex: <p>,<a>,<em>,<strong>,<br>)
        $text = strip_tags($text, $exceptions);

        $maxCount = 55; //DEFAULT WP WORD COUNT, INCREASE/DECREASE AS NEEDED
        $excerpt_length = apply_filters('excerpt_length', $maxCount);

        $moreText = '.... <a href="'.get_permalink($post->ID).'">Read More &gt;&gt;</a>'; //CUSTOM MORE TEXT, CHANGE AS NEEDED
        $excerpt_more = apply_filters('excerpt_more', $moreText);

        $words = preg_split("/[\n\r\t ]+/", $text, $excerpt_length+1, PREG_SPLIT_NO_EMPTY);
        if(count($words) > $excerpt_length)
        {
            array_pop($words);
            $text = implode(' ', $words);
            $text = $text.$excerpt_more;
        }
        else
            $text = implode(' ', $words);
    }
    return apply_filters('wp_trim_excerpt', $text, $raw_excerpt);
}

只需将其添加到您的 functions.php 文件中，它就可以满足您的所有需求。让我知道这是否有帮助。

于 2012-06-07T20:09:52.537 回答