我如何使用 HTML 中的数据属性从数据库中使用 link 填充 link 和图像源？

Question

我有一个数据库，其中有一个 table，其中有一个名为 "link" 的列，其中包含一个 link，例如“http://www.google.com", and a column called "image" that holds this "http://www.placehold.it/500x500”。

然后我有以下 html:

<a href="" data-field="link">
  <img src="" data-field="image">
</a>

我有一个 PHP 后端，它使用 JSON 和一个 JQuery 插件来检索和填充信息，但我不知道如何填写 href"" 和 src" " 具体属性。

如何使用 JQuery/JavaScript 执行此操作？

Answer 1

这就是你想要的吗？

$("a[data-field='link']").attr("href",yourValue);
$("img[data-field='image']").attr("src",yourAnotherValue);

Answer 2

你的意思是这样的吗 http://jsfiddle.net/0jLad8hj/

$(document).ready(function(){
    $('a').attr('href', function(){
    return $(this).data('field');
}).find('img').attr('src', function(){
        return $(this).data('field');
    });;
});

使用 jQuery 中的 .attr 函数。第一个值是要设置的属性，第二个是值。 .data 获取数据属性

我如何使用 HTML 中的数据属性从数据库中使用 link 填充 link 和图像源？

How would I use a data-attribute in HTML to fill a link and image source with a link from a database?

html

javascript

php

jquery

custom-data-attribute