检查JSON的img标记并在JavaScript中更改src

时间:2014-05-31 13:26:38

标签: javascript jquery html json image

我们有一个定制的CRM,它将IMG作为/upload/image/image.jpg保存在我们的数据库中,但我们也有完整网址的图像。我需要一种方法来确定图像是否以/ upload开头并将我们的网址添加到该图像src的前面,以便图像正确显示并且不会得到没有图像的正方形,

我们正在使用JSON和javascript,这是我们到目前为止的代码

function loadnewsstory(e)
{

    if(newsview !== true)
    {
        document.getElementById("newsarticals").style.display = "block";
        document.getElementById("activecontent").style.display = "none";
        newsview = true;
    }


    xmlhttp=new XMLHttpRequest();
    xmlhttp.open("POST","http://media.queerdio.com/mobileDevice/?uri=loadstory/"+e ,false);
    xmlhttp.send();

    var newsreponse = JSON.parse(xmlhttp.responseText);
    var news = newsreponse[0];

    document.getElementById("newsarticals").innerHTML = '<h1 class="newsheader">' + news.post_title + '</h1> <div class="newsbody">'+news.post_content+'</div>';
    window.scrollTo(0,0);

}

我们需要关注的部分是news.post_content

编辑: 添加了JSON的样子

"post_content":"<p>DR SHARON Giese is a household name in America, starring on hit medical shows Dr Oz and The Doctors and making regular appearances on CBS News, CNN and NBC.<\/p>\n<p>Dr Giese is ranked among the best in her field but, as one family discovered \"with tragic consequences\" even the best make mistakes.<\/p>\n<center><img src=\"..\/..\/..\/upload\/Health\/Dr Sharon Giese - Dr OZ - YouTube.jpg\" alt=\"Dr Oz Show - DR SHARON\" width=\"650\" height=\"488\" \/><\/center>\n<div style=\"padding: 0; margin: -6px 0 4px 10px; text-align: left;\">A screen grab from a recent appearance on the Dr Oz show. Picture: YouTube Source: YouTube<\/div>\n<p>In June 2009, 32-year-old mother-of-two Adriana Porras underwent liposuction, a fat reduction procedure performed by Dr Giese. Ms Porras died two days later of a pulmonary embolism.<\/p>\n<p>Her husband Pablos Balzola then sued Dr Giese for negligence, claiming she did not return their frantic calls when Ms Porras showed signs of severe post-surgery complications, complaining of chest pains and shortness of breath.<\/p>\n<p>In court, pathologists testified that had she received treatment for those symptoms, her chance of survival would have been much higher.<\/p>\n<p>It was later found out that Dr Giese had not performed the procedure in a hospital but in her own home office.<\/p>\n<p>This week she finally reached a settlement with Mr Balzola, agreeing to pay US$2.3 million (AUD$2.5 million)<\/p>\n<p>The money will reportedly be split between the widower, his six-year-old daughter Maia and nine-year-old son Nicholas. Mr Balzola"

我已将此代码用于我们的feature_images

 if(news.featured_image.substring(0, 7) !== "http://")
        {
        news.featured_image = "http://www.radiobreakout.com.au/"+news.featured_image;
        }

但是如何让它在post_content中查看img srcs。

1 个答案:

答案 0 :(得分:0)

请考虑一下:

var articles = document.getElementById('newsarticals');
var activeContent = document.getElementById('activecontent');
var httpUrl = /^http:/;
function loadnewsstory(e) {
    if (newsview !== true) {
        articles.style.display = 'block';
        activeContent.style.display = 'none';
        newsview = true;
    }

    var xmlhttp = new XMLHttpRequest();
    xmlhttp.open('POST','http://media.queerdio.com/mobileDevice/?uri=loadstory/' + e , false);
    xmlhttp.send();

    // empty the articles element first
    while (articles.children.length) articles.removeChild(articles.firstChild);
    // create a document fragment out of the response
    var newsArray = JSON.parse(xmlhttp.responseText);
    var newsEl = newsArray.reduce(function htmlCreator(frag, news) {
        // create the elements properly first
        var header = document.createElement('h1');
        var div = document.createElement('div');
        header.className = 'newsheader';
        header.appendChild(document.createTextNode(news.post_title));
        // innerHTML shouldn't really be used, but we'll let it slide this time
        // next time don't store html in json
        div.innerHTML = news.post_content;
        div.className = 'newsbody';
        // loop through all of the newly added images to change the sources
        Array.prototype.forEach.call(div.querySelectorAll('img'), function sourceMangler(el) {
            if (!httpUrl.test(el.src)) el.src = 'http://www.radiobreakout.com.au/' + el.src.split('/').filter(function removeSome(part) { return (part && part !== '..'); }).join('/');
        });
        frag.appendChild(header);
        frag.appendChild(div);
        return frag;
    }, document.createDocumentFragment());
    // append the fragment to the empty element
    articles.appendChild(newsEl);
    window.scrollTo(0,0);
}
相关问题