尝试根据 URL 参数将 jpg 加载到页面上

Trying to load a jpg onto a page based on a URL Parameter

我有一个站点页面(Wiki 页面)根据打开页面时发送的 URL 参数重新使用。 URL参数用于过滤页面中各种文档库和自定义列表的内容

此外,我想添加代码以获取此 URL 参数并在自定义列表中查找项目以获取 JPG 图像并替换当前页面上的图像。 (或将其插入页面的左上部分)。

知道如何完成这个吗?提前谢谢你。

由于该网站现在通过将作业问题评级为负面来惩罚 students/users 学习,我将超越“专家”用户并 post 回答此作业。花了我很多时间,因为这不是我的专长。

我使用以下代码创建了脚本编辑器 Web 部件:

<script type="text/javascript" src="../SiteAssets/js-enterprise/DisplayVirtualPicture.CEWP.js"></script>
<script type="text/javascript">
        SP.SOD.executeFunc('sp.js', 'SP.ClientContext', LoadAll);
        function LoadAll()
        {getPicture();}
</script>
<img style="max-width:600px" title="undefined" src="https:xxxxxxx/SiteAssets/images/Blank.jpg">

脚本DisplayVirtualPicture.CEWP.js是:

var currentID = GetUrlKeyValue('Name');
//console.log(currentID);

function getPicture() {
    var mytable = "";
    var clientContext = new SP.ClientContext.get_current();
    var oList = clientContext.get_web().get_lists().getByTitle('VirtualPageLibrary');
    var camlQuery = new SP.CamlQuery();
    camlQuery.set_viewXml('<View><Query><Where><Eq><FieldRef Name=\'Title\'/><Value Type=\'Text\'>'+ currentID +'</Value></Eq></Where></Query></View>'); 

    var collListItem = oList.getItems(camlQuery);
    //clientContext.load(collListItem, 'Include(VirtualPicture, Title, Id)');
    clientContext.load(collListItem);
    clientContext.executeQueryAsync(function () {
       var swListItms = collListItem.getEnumerator();
       while (swListItms.moveNext())
       {
           var swItm = swListItms.get_current();
           var mytable = swItm.get_item('VirtualPicture').get_url(); 
           //console.log("img="+mytable);
           $("img[title='undefined']").attr("src",mytable);
       }
       clientContext.executeQueryAsync(onQuerySucceededp,onQueryFailedp);
    },
    function (sender, args) 
    {
        console.log('Request failed. ' + args.get_message() +
            '\n' + args.get_stackTrace());
    });
}

function onQuerySucceededp(sender, args) {
    //console.log("success-1");
}
function onQueryFailedp(sender, args) {
    alert('Error: ' + args.get_message() + '\n' + args.get_stackTrace());
}

这可能不是完成此任务的最有效方法,但如果没有与本网站的专家用户合作,这是我能做的最好的方法。