我得到了一个数组,我正在遍历该数组.每次条件为真时,我都想将下面HTML个代码的副本附加到带有一些值的容器元素中.

我可以把这个HTML放在哪里,以便以一种聪明的方式重用呢?

<a href="#" class="list-group-item">
    <div class="image">
         <img src="" />
    </div>
    <p class="list-group-item-text"></p>
</a>

JQuery

$('.search').keyup(function() {
    $('.list-items').html(null);

    $.each(items, function(index) {
        // APPENDING CODE HERE
    });
});

推荐答案

You could decide to make use of a templating engine in your project, such as:

If you don't want to include another library, John Resig offers a jQuery solution, similar to the one below.


Browsers and screen readers ignore unrecognized script types:

<script id="hidden-template" type="text/x-custom-template">
    <tr>
        <td>Foo</td>
        <td>Bar</td>
    <tr>
</script>

Using jQuery, adding rows based on the template would resemble:

var template = $('#hidden-template').html();

$('button.addRow').click(function() {
    $('#targetTable').append(template);
});

Jquery相关问答推荐

DataTables:无法读取未定义的属性“长度”

JQuery:如果 div 可见

为什么要两次声明 jQuery?

如何使用 ES6 语法导入 jquery?

document.querySelector 一个元素中的多个数据属性

Bootstrap 折叠动画不流畅

JavaScript 中的简单节流阀

在大写字母前插入空格

试图将 jquery 加载到 Tampermonkey 脚本中

使用 jQuery 更改 .prop 不会触发 .change 事件

如何以编程方式触发 ngClick

lodash debounce 在匿名函数中不起作用

调用 e.preventDefault() 后提交表单

如何使 Bootstrap 轮播滑块使用移动左/右滑动

如何判断是否有任何 JavaScript 事件侦听器/处理程序附加到元素/文档?

jQuery获取图片src

jQuery 的 .on() 方法结合提交事件

了解 Backbone.js REST 调用

如何为基本身份验证发送正确的授权标头

jQuery ajax() 使用成功、错误和完成与 .done()、.fail() 和 always()