如何在渲染的HTML中的div中插入图像标记?

时间:2014-12-03 12:32:05

标签: jquery asp.net xslt pdf.js

我正在使用pdf.js来显示pdf文本以及图像(我通过xslt插入)但图像不会在生成的html中呈现。只有渲染的html文本。

渲染输出

<div class="textLayer">
<div data-canvas-width="22.717943046104818" data-font-name="font_p0_1" dir="ltr" data-text-length="6" style="font-size: 8.378597354949745px; left: 110.52924529041462px; top: 627.8325441560373px; -webkit-transform: scale(1.195681212952885, 1); -webkit-transform-origin: 0% 0%; cursor: text;">Click&nbsp;</div>
.
.
.
.
.
</div>

我的xslt代码是

<fo:block space-after="1pt">
                <xsl:apply-templates/>
                . Click  here
                <fo:external-graphic>
                                <xsl:attribute name="src">
                                    <xsl:text>url('</xsl:text><xsl:value-of select="$ImagePath"/><xsl:text>')</xsl:text>
                                </xsl:attribute>
                            </fo:external-graphic>
                            to Open Table
            </fo:block>

我已尝试使用以下代码在渲染的html中插入div

  function addDiv() {
        var objTo = $(".textLayer");
        var divtest = document.createElement("div");
        divtest.innerHTML = "new div";
        objTo.append(divtest);
        alert('added');
    }
$(function () {
     addDiv();
    });

但div没有插入dom。

我的项目要求是,当用户点击图片时,某些div应显示,但如果没有标签可以点击图片,那么该图片是否可以点击。

1 个答案:

答案 0 :(得分:1)

试试这个

function addDiv() {
        var objTo = $(".textLayer");
        var divtest = document.createElement("div");
        divtest.innerHTML = "new div";
        objTo.get().appendChild(divtest); 
        alert('added');
    }

$(function () {
     addDiv();
    });