Javascript //如果图像存在* 如果(image.length!==0){ //*创建图像包装器 $(this.prepend(“”); //*在图像包装器中附加第一个图像,并在其之后包装所有文本元素 $(this.find('.entry image').appen

Javascript //如果图像存在* 如果(image.length!==0){ //*创建图像包装器 $(this.prepend(“”); //*在图像包装器中附加第一个图像,并在其之后包装所有文本元素 $(this.find('.entry image').appen,javascript,jquery,cdata,Javascript,Jquery,Cdata,//如果图像存在* 如果(image.length!==0){ //*创建图像包装器 $(this.prepend(“”); //*在图像包装器中附加第一个图像,并在其之后包装所有文本元素 $(this.find('.entry image').append(image.nextAll().wrapAll(''); } } //如果snippet选项为true* if(options.snippet){ //*设置字符限制 var content=$(this.find('.entry cont

//如果图像存在* 如果(image.length!==0){ //*创建图像包装器 $(this.prepend(“”); //*在图像包装器中附加第一个图像,并在其之后包装所有文本元素 $(this.find('.entry image').append(image.nextAll().wrapAll(''); } } //如果snippet选项为true* if(options.snippet){ //*设置字符限制 var content=$(this.find('.entry content'); var contentLength=$(content).text().length; 内容.文本(功能(i,v){ 如果(contentLength==0){ 返回“”; }else if(contentLength!==0&&contentLength html,正文{ -webkit字体平滑:抗锯齿; -webkit文本大小调整:100%; 背景色:#fff; 颜色:#fff; 字体系列:“蒙特塞拉特”,arial,无衬线; 字体大小:100%; 字体大小:400; 身高:100%; 线高:1.45; } #包装纸{ 保证金:0自动; 最大宽度:1200px; 填充:3rem 0 5rem; 宽度:90%; } .rss源{ -webkit视角:1; 列填充:平衡; 柱间距:2rem; 保证金:0; 填充:0; } .入口包装{ 背景色:#006b3a; 边界半径:1px; 显示:内联块; 边缘底部:2rem; 位置:相对位置; 垂直对齐:顶部; 宽度:100%; } .入口图像img{ 边界半径:1px1p0; 显示:块; 高度:自动; 最大宽度:100%; 宽度:100%; } .参赛作品名称h4{ 字体大小:1.5rem; 线高:1.2; } .参赛作品名称h4 a{ 颜色:#fff; 文字装饰:无; 过渡:颜色200ms易于输入输出; } .条目标题h4 a:悬停{ 颜色:rgba(255255.7); } .条目标题h4 a::之后{ 内容:“\02197”; 左边缘:.5rem; } .参赛日期{ 背景色:#006b3a; 字体大小:.75rem; 位置:绝对位置; 排名:0; 右:0px; 填充物:25雷姆。5雷姆; 边界半径:0 1px; } .条目文本{ 边框顶部:3px实心#00371d; 填充:1rem; } .参赛内容{ 保证金:.6250雷姆; } .条目内容:空{ 显示:无; } @仅介质屏幕和(最小宽度:480px){ .rss源{ 列数:1; } } var提要='---地址rss提要--'; $(“#提要”).yrss(提要{ ssl:false, 限额:2, 反面:错, 是的, 最大年龄:3600, 罗:是的, errormsg:“”, 标签:是的, 日期:对, dateformat:'拼写月份', 标题标签:“h4”, 内容:对,, 图片:没错, 片段:没错, 最高限额:120, 链接目标:“\u blank” },函数(){ //可选回调函数 });
请回答您的问题,说明
html
选项
变量是如何设置的。这
是什么
?您好,谢谢您的评论,如果您检查.find()上方的脚本,我想在cdata中找到img标记不起作用。是否有其他方法或脚本可以在cdata中找到img?因此,请再次说明
html
是如何设置的。(我现在已经意识到
这是什么;我一开始没有得到它,因为没有缩进。)呵呵,好的,我更新了我的问题,我添加了整个脚本。:)
 <content:encoded>
    <![CDATA[<div> <a> **<img />** </a> </div>  ]]>
 </content:encoded>
// provisional html result
    htmlObject = $(html);
    // if content option is true... *
    if (options.content) {
    // for each entry... *
    $.each(htmlObject, function () {
    // if image option is true... *
    if (options.image) {
    // * check for first image
    var image = $(this).find('img').first(); <<< doesn't find the img
    // if image exists... *
    if (image.length !== 0) {
    // * create image wrapper`enter code here`
    $(this).prepend('<div class="entry-image">');

    // * append first image in image wrapper and wrap all textual elements after it
    $(this).find('.entry-image').append(image).nextAll().wrapAll('<div class="entry-text"></div>');
      }
    }
/* YRSS 1.1.2 */
// use strict mode
'use strict';

$.fn.yrss = function (url, options, fn) {

    // plugin defaults
    var defaults = {
        ssl: false,
        limit: 10,
        reverse: false,
        cache: true,
        maxage: 3600,
        showerror: true,
        errormsg: '',
        tags: false,
        date: true,
        dateformat: 'default',
        titletag: 'h4',
        content: true,
        image: true,
        snippet: true,
        snippetlimit: 120,
        linktarget: '_self'
    };

    // extend options
    options = $.extend(defaults, options);

    // return function
    return this.each(function (i, e) {
        // check for ssl protocol
        var s = '';
        if (options.ssl) { s = 's'; }

        // add class to container
        if (!$(e).hasClass('rss-feed')) { $(e).addClass('rss-feed'); }

        // check for valid url
        if (url === null) { return false; }

        // create yql query
        var query = 'http' + s + '://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent('select * from feed where url="' + url + '"');

        // set limit
        if (options.limit !== null) { query += ' limit ' + options.limit; }

        // reverse feed order
        if (options.reverse) { query += ' | reverse()'; }

        // set maximum cache age
        if (options.cache) { query += '&_maxage=' + options.maxage; }

        // specify format
        query += '&format=json';

        // send request
        $.getJSON(query, function (data, status, errorThrown) {
            // if successful... *
            if (status === 'success') {
                // * run function to create html result
                process(e, data, options);

                // * optional callback function
                if ($.isFunction(fn)) { fn.call(this, $(e)); }

                // if there's an error... *
            } else if (status === 'error' || status === 'parsererror') {
                // if showerror option is true... *
                if (options.showerror) {
                    // variable scoping (error)
                    var msg;

                    // if errormsg option is not empty... *
                    if (options.errormsg !== '') {
                        // * assign custom error message
                        msg = options.errormsg;

                        // if errormsg option is empty... *
                    } else {
                        // * assign default error message
                        msg = errorThrown;
                    }

                    // * display error message
                    $(e).html('<div class="rss-error"><p>' + msg + '</p></div>');

                    // if showerror option is false... *
                } else {
                    // * abort
                    return false;
                }
            }
        });
    });
};

// create html result
var process = function (e, data, options) {
    // feed data (entries)
    var entries = data.query.results.item;

    // check if entries are not inside an array (only 1 entry)
    if (!$.isArray(entries)) { entries = [entries]; }

    // abort if no entries exist
    if (!entries) { return false; }

    // html variables
    var html = '';
    var htmlObject;

    // for each entry... *
    $.each(entries, function (i) {
        // * assign entry variable
        var entry = entries[i];

        // * variable scoping (tags)
        var tags;

        // if entry tags exist... *
        if (entry.category !== undefined) {
            // * arrange entry tags
            tags = entry.category.toString().toLowerCase().replace(/ /g, '-').replace(/,/g, ' ');
        }

        // * variable scoping (date)
        var pubDate;

        // if date option is true... *
        if (entry.pubDate) {
            // * create date object
            var entryDate = new Date(entry.pubDate);

            // * select date format
            if (options.dateformat === 'default') {
                pubDate = (entryDate.getMonth() + 1).toString() + '/' + entryDate.getDate().toString() + '/' + entryDate.getFullYear();
            } else if (options.dateformat === 'spellmonth') {
                var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
                pubDate = months[entryDate.getMonth()] + ' ' + entryDate.getDate().toString() + ', ' + entryDate.getFullYear();
            } else if (options.dateformat === 'localedate') {
                pubDate = entryDate.toLocaleDateString();
            } else if (options.dateformat === 'localedatetime') {
                pubDate = entryDate.toLocaleDateString() + ' ' + entryDate.toLocaleTimeString();
            }
        }

        // * build entry
        html += '<div class="entry-wrapper"';
        if (options.tags && entry.category !== undefined) { html += 'data-tag="' + tags + '"'; }
        html += '><div class="entry-title"><' + options.titletag + '><a href="' + entry.link + '">' + entry.title + '</a></' + options.titletag + '></div>';
        if (options.date && pubDate) { html += '<div class="entry-date">' + pubDate + '</div>'; }

        // if content option is true... *
        if (options.content) {
            // * check for rss description/encoded value
            var content;
            if (entry.description !== undefined) {
                content = $.trim(entry.description);
            } else {
                content = $.trim(entry.encoded);
            }

            // * build content
            html += '<div class="entry-content">' + content + '</div>';
        }

        html += '</div>';
    });

    // provisional html result
    htmlObject = $(html);

    // if content option is true... *
    if (options.content) {
        // for each entry... *
        $.each(htmlObject, function () {
            // if image option is true... *
            if (options.image) {
                // * check for first image
                var image = $(this).find('img').first();

                // if image exists... *
                if (image.length !== 0) {
                    // * create image wrapper
                    $(this).prepend('<div class="entry-image">');

                    // * append first image in image wrapper and wrap all textual elements after it
                    $(this).find('.entry-image').append(image).nextAll().wrapAll('<div class="entry-text"></div>');
                }
            }

            // if snippet option is true... *
            if (options.snippet) {
                // * set character limit
                var content = $(this).find('.entry-content');
                var contentLength = $(content).text().length;
                content.text(function (i, v) {
                    if (contentLength === 0) {
                        return '';
                    } else if (contentLength !== 0 && contentLength <= options.snippetlimit) {
                        return v;
                    } else {
                        return v.substring(0, options.snippetlimit) + ' ...';
                    }
                });
            }
        });
    }

    // append final html result
    $(e).append(htmlObject);

    // apply target to links
    $('a', e).attr('target', options.linktarget);
};
<!DOCTYPE html>
<!--meta information-->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<!--scripts
<script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="yrss.min.js"></script>

<!--styles
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">-->

<style>
    html,body {
    -webkit-font-smoothing:antialiased;
    -webkit-text-size-adjust:100%;
    background-color:#fff;
    color:#fff;
    font-family:"Montserrat", arial, sans-serif;
    font-size:100%;
    font-weight:400;
    height:100%;
    line-height:1.45;
    }

    #wrapper {
    margin:0 auto;
    max-width:1200px;
    padding:3rem 0 5rem;
    width:90%;
    }

    .rss-feed {
    -webkit-perspective:1;
    column-fill:balance;
    column-gap:2rem;
    margin:0;
    padding:0;
    }

    .entry-wrapper {
    background-color:#006b3a;
    border-radius:1px;
    display:inline-block;
    margin-bottom:2rem;
    position:relative;
    vertical-align:top;
    width:100%;
    }

    .entry-image img {
    border-radius:1px 1px 0 0;
    display:block;
    height:auto;
    max-width:100%;
    width:100%;
    }

    .entry-title h4 {
    font-size:1.5rem;
    line-height:1.2;
    }

    .entry-title h4 a {
    color:#fff;
    text-decoration:none;
    transition:color 200ms ease-in-out;
    }

    .entry-title h4 a:hover {
    color:rgba(255,255,255,.7);
    }

    .entry-title h4 a::after {
    content:"\02197";
    margin-left:.5rem;
    }

    .entry-date {
    background-color:#006b3a;
    font-size:.75rem;
    position:absolute;
    top:0;
    right:0px;
    padding:.25rem .5rem;
    border-radius:0 0 0 1px;
    }

    .entry-text {
    border-top:3px solid #00371d;
    padding:1rem;
    }

    .entry-content {
    margin:.625rem 0 0;
    }

    .entry-content:empty {
    display:none;
    }

    @media only screen and (min-width:480px) {
        .rss-feed {
        column-count:1;
        }
    }   



 </style>
</head>

<body>
<div id="wrapper">
    <div id="feed"></div>
</div>

<script>
    var feed = ' ---address rss feed--- ';
    $('#feed').yrss(feed, {
        ssl: false,
        limit: 2,
        reverse: false,
        cache: true,
        maxage: 3600,
        showerror: true,
        errormsg: '',
        tags: true,
        date: true,
        dateformat: 'spellmonth',
        titletag: 'h4',
        content: true,
        image: true,
        snippet: true,
        snippetlimit: 120,
        linktarget: '_blank'
    }, function () {
        // optional callback function
    });
</script>
</body>
</html>