图像未在追加时以 html 格式呈现
Image not Rendering in html on append
我从这样的API得到响应(这是其中的一部分)
{
"Content": "<span class="PubAPIAd"><script type="text/javascript" src="http://ru.gwallet.com/r1/ad/MTAuMTAyLjIuNzQgODg4OA==/c366792T246999B22980F24848R13t2?data=zmxnsak48w9msqkeq9hbz4dja7u4sstqxoircsqutictr7inboxhwujhu8n1c9scn5t53xs396h6re6nz4u1a1brbnmzzxjt7qy8difcdkgk9g34ngknd9qky7w5udgzrhm64h74abbpyh47djbgb5acp3f1ghb1kfeysy716j133gqhydk3au6ydj8h14aztefkrjfp7fj3mqj54sntbrhosseh397g7g7ns75ja3rhwcq9gzao5m6g8h9zph5sckzeoahibtru5cbda7bpcfmrra&auction_price=0.05"></script></span> <img src="http://aktrack.pubmatic.com/AdServer/AdDisplayTrackerServlet?operId=1&pubId=51762&siteId=51766&adId=95947&adServerId=243&kefact=0.050000&kaxefact=0.050000&kadNetFrequecy=1&kadwidth=320&kadheight=50&kadsizeid=31&kltstamp=1416004675&indirectAdId=0&adServerOptimizerId=2&ranreq=0.05247270006223126&kpbmtpfact=0.050000&dcId=2&tldId=80779&passback=0&imprId=139A6406-07A0-4DD1-8B76-81C35E5EA412&mobflag=1&ismobileapp=1&modelid=604&osid=7&udidtype=0&campaignId=6575&creativeId=0&pctr=0.000000&wDSPByrId=11&imprCap=1&pageURL=http%3A%2F%2Fatt_1617ee24-7ff6-4402-9e8b-77dcb53f880f.com" width="1" height="1" />"
}
我正在尝试使用 Jquery append 或 js innerHTML 将"内容"附加到我网页上的div 以显示广告。但是我没有看到图像。
document.getElementById('myDiv').innerHTML = response.Content;
但是,如果我将其硬编码到我的 HTML 中以开始它会显示一个图像。
真的很想知道为什么会发生这种情况以及我如何解决它
注意:我无法控制后端。此外,此图像是我正在尝试加载的广告,因此请禁用广告拦截器以尝试查看它。
编辑:这是在控制台中看到的内容
Resource interpreted as Image but transferred with MIME type text/html: "http://aktrack.pubmatic.com/AdServer/AdDisplayTrackerServlet?operId=1&pubId…mprCap=1&pageURL=http%3A%2F%2Fatt_1617ee24-7ff6-4402-9e8b-77dcb53f880f.com".
编辑2:这是硬编码的示例(正确呈现)。需要禁用广告拦截器才能查看 --> http://jsfiddle.net/0z1cybrf/
我假设response.Content
返回您要插入myDiv
html
。 在这种情况下,你可以简单地使用jQuery。
$('#myDiv').append(response.Content);
正如Samuel Liew在评论中指出的那样,您的字符串无效。 您可以通过将属性旁边的引号更改为'
(单引号)来解决此问题。
编辑 - 试试这个:
$('#myDiv').append('<span class="PubAPIAd"><script type="text/javascript" src="http://ru.gwallet.com/r1/ad/MTAuMTAyLjIuNzQgODg4OA==/c366792T246999B22980F24848R13t2?data=yydr8ogr3e5zsn1cacgexhma83oaf1xzjfyna3mgdwi473hf3wjcwujhu8n1c9scn5t53xs396h6re6nz4u1a1brbnmzzxjt7qy8difcdkgk9g34ngknd9qky7w5udgzrhm64h74abbpyh47djbgb5acp3f1ghb1kfeysy716j133gqhydksc3h869rc47kzse66wx4hpx4uiqj54sntbrhosseh397g7g7ns75ja3rhwcq9gzao5m6g8h9zph5sckzeoahibtru5cbda7bpcfmrra&auction_price=0.05"></script></span><img src="http://aktrack.pubmatic.com/AdServer/AdDisplayTrackerServlet?operId=1&pubId=51762&siteId=51766&adId=95947&adServerId=243&kefact=0.050000&kaxefact=0.050000&kadNetFrequecy=1&kadwidth=320&kadheight=50&kadsizeid=31&kltstamp=1416004779&indirectAdId=0&adServerOptimizerId=2&ranreq=0.20811005185761733&kpbmtpfact=0.050000&dcId=2&tldId=0&passback=0&imprId=E1FB9573-FF52-4CAC-BFE1-92EDBDC23FD2&mobflag=1&ismobileapp=1&modelid=604&osid=7&udidtype=0&campaignId=6575&creativeId=0&pctr=0.000000&wDSPByrId=11&imprCap=1&pageURL=http%3A%2F%2Fatt_1617ee24-7ff6-4402-9e8b-77dcb53f880f.com" width="1" height="1" />');
告诉我你是否得到相同的结果。
### 最终编辑
###似乎script
标签中的javascript没有执行,这就是图像没有显示的原因。 为了证明这一点,您可以像以前一样插入Content
,然后访问 <script>
src
属性中给出的链接。复制脚本并转到控制台。 将代码粘贴到控制台中,然后按回车键。 图像应显示。 至少它对我有用。您可以尝试将 script
标记硬编码到 html 中,因为这不会改变。
网页代码
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" ></script>
<script src="functions.js></script>
<script type='text/javascript' src='http://ru.gwallet.com/r1/ad/MTAuMTAyLjIuNzQgODg4OA==/c366792T246999B22980F24848R13t2?data=yydr8ogr3e5zsn1cacgexhma83oaf1xzjfyna3mgdwi473hf3wjcwujhu8n1c9scn5t53xs396h6re6nz4u1a1brbnmzzxjt7qy8difcdkgk9g34ngknd9qky7w5udgzrhm64h74abbpyh47djbgb5acp3f1ghb1kfeysy716j133gqhydksc3h869rc47kzse66wx4hpx4uiqj54sntbrhosseh397g7g7ns75ja3rhwcq9gzao5m6g8h9zph5sckzeoahibtru5cbda7bpcfmrra&auction_price=0.05'></script>
</head>
<body>
<DIV id="myDiv" ></DIV>
</body>
</html>
jQuery Code functions.js
$(document).ready(function() {
$(window).load(function() {
$('#myDiv').append("<img src='http://aktrack.pubmatic.com/AdServer/AdDisplayTrackerServlet?operId=1&pubId=51762&siteId=51766&adId=95947&adServerId=243&kefact=0.050000&kaxefact=0.050000&kadNetFrequecy=1&kadwidth=320&kadheight=50&kadsizeid=31&kltstamp=1416004779&indirectAdId=0&adServerOptimizerId=2&ranreq=0.20811005185761733&kpbmtpfact=0.050000&dcId=2&tldId=0&passback=0&imprId=E1FB9573-FF52-4CAC-BFE1-92EDBDC23FD2&mobflag=1&ismobileapp=1&modelid=604&osid=7&udidtype=0&campaignId=6575&creativeId=0&pctr=0.000000&wDSPByrId=11&imprCap=1&pageURL=http%3A%2F%2Fatt_1617ee24-7ff6-4402-9e8b-77dcb53f880f.com' width='1' height='1' />");
});
});
相关文章:
- PHP:显示sqlite数据库中的html格式数据,使用tinymce保存
- JavaScript生成html格式的密码
- 如何在angularjs中实现html格式的字符串
- 如何重写Javascript If语句以选择Classes而不是ID's的HTML格式
- 如何使用JQUERY解析大型XML文件并将其可视化为HTML格式
- 正则表达式,用于从html格式的字符串中提取文本
- 表单中的CSS、HTML格式
- 以 HTML 格式预加载图像
- 如何使用 Ajax 以 html 格式呈现没有布局的 Rails 操作
- 使用JSONPjquery获取HTML格式的XML数据
- 如何在angular js中从github获取原始自述文件后将其转换为html格式的文档
- 从字面上看,以HTML格式输出PHP代码
- 循环多维数组并以 html 格式显示数据
- 从单选按钮中获取值以选择 html 格式的图像
- 以 HTML 格式显示计算结果 (javascript)
- 在 SciTE 中测试和编辑 JavaScript(独立和 HTML 格式)
- 从另一个网页以 HTML 格式通过电子邮件发送当前购物车
- HTML 保留字符串与 html 格式
- 导入 html 格式的外部 js 文件
- 如何使用多子对象值构建 angularjs html 格式