且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

是否有生成HTML与JavaScript***实践

更新时间:2023-09-29 18:21:10

选项#1和#2将是你最直接简单的选择,但是,对于这两个选项,你会感觉到性能和维护由建筑物或者字符串或创建DOM对象的影响。

模板是不是所有的不成熟,而你看到它弹出在大多数主要的JavaScript框架。

下面是在 JQuery的模板插件为例,将节省您的性能损失,而且是真的,真的很简单:

 变种T = $ .template('< D​​IV>< IMG SRC =$ {U​​RL}/> $ {名}< / DIV>');

$(选择).append(T,{
     网址:jsonObj.url,
     名称:jsonObj.name
});
 

我说去凉爽的路线(和更高性能,更易于维护),并使用模板。

I'm calling a web service that returns an array of objects in JSON. I want to take those objects and populate a div with HTML. Let's say each object contains a url and a name.

If I wanted to generate the following HTML for each object:

    <div><img src="the url" />the name</div>

Is there a best practice for this? I can see a few ways of doing it:

  1. Concatenate strings
  2. Create elements
  3. Use a templating plugin
  4. Generate the html on the server, then serve up via JSON.

Options #1 and #2 are going to be your most immediate straight forward options, however, for both options, you're going to feel the performance and maintenance impact by either building strings or creating DOM objects.

Templating isn't all that immature, and you're seeing it popup in most of the major Javascript frameworks.

Here's an example in JQuery Template Plugin that will save you the performance hit, and is really, really straightforward:

var t = $.template('<div><img src="${url}" />${name}</div>');

$(selector).append( t , {
     url: jsonObj.url,
     name: jsonObj.name
});

I say go the cool route (and better performing, more maintainable), and use templating.