javascript-如何在变量内修改模板html的值

我有一个Ajax调用,它获得了不同的描述以及视频的URL地址：

function TraerInstructivos() {
    $.ajax({
        type: "GET",url: '<%= Page.ResolveUrl("~/Instructivo/Instructivos.aspx") %>' + '/TraerInstructivos',contentType: "application/json; charset=utf-8",dataType: "json",success: function (response) {
            var res = JSON.parse(response.d);
            $.each(res,function (i,item) {
                DibujarVideo(item);
            });
        },error: function (response) {
            alert("Error");
        }
    });
};

现在,DibujarVideo是一种方法,它将获取我在ascx中拥有的模板,进行复制,然后附加它.这是ascx的HTML：

<div id="Videos">

</div>

<template id="video-elem">
    <div class="row">
        <div class="col-lg-4">
            <font id="video-desc" size="3"></font>
            <br />
            <br />
            <p><a id="video-ref" class="btn btn-secondary" href="#" role="button">Mira el Video &raquo;</a></p>
        </div>
    </div>
    <br />
    <hr />
</template>

现在,复制模板html的方法如下所示：

function DibujarVideo(video) {
    var elemACrear = $("#video-elem").html();

    $(elemACrear).find("#video-ref").attr("href",video.DireccionVideo);

    console.log(elemACrear);

    $("#Videos").append(elemACrear);

}

我在控制台日志中看到的页面和页面是href的值没有更改,但是如果将其保存在变量中,则可以看到例如以下更改：

var elem = $(elemACrear).find("#video-ref").attr("href",video.DireccionVideo);

因此,我认为在页面和变量中更改/操作DOM树并不相同.

如何在elemACrear变量中更改该href？

我正在学习jQuery,感谢所有帮助.

最佳答案

您已经诊断并解决了问题,而没有遵循逻辑.您只需要将在elem变量中创建的jQuery对象提供给append()调用,如下所示：

function DibujarVideo(video) {
  var elemACrear = $("#video-elem").html();
  var $elem = $(elemACrear);
  $elem.find("#video-ref").attr("href",video.DireccionVideo);
  $("#Videos").append($elem);
}

javascript-如何在变量内修改模板html的值

猜你在找的jQuery相关文章