作者：小妖694_807 | 2023-08-27 12:15
我可能做错了什么,但我还没有找到一种很好的方法来动态地构建基本的HTML/DOM结构,比如列表.简单的例子是给出像json(objects)这样的输入,构建一个表(表元素,行,单元格,具有正确转义的文本内容).
我遇到的问题是,大多数调用(如".append()",".html()",".text()")似乎并不直观(对我而言).例如,你不能做类似的事情:
$("#divId").append("").append("").append("| ").text("some text");
text()调用似乎消灭了主要级别的内容; 并附加同样添加相同范围内的东西.我希望appennd()能够返回添加的内容,但它似乎正在返回自己的上下文.
我知道有一个简单的"appendText()"扩展,它有助于最后一部分.但其他人怎么样？
对于它的价值,现在我通过类似的方式回归到DOM
$("#divId")[0].appendChild(document.createElement("table"))....
但那很啰嗦.
所以我希望我错过了一些完全明显的东西......但是什么呢？除了追加()以外的电话？
我尝试浏览jQuery参考文档,谷歌搜索,但大多数文档只是使用"嵌入字符串中的所有东西"; 哪些问题,包括没有正确引用文本内容的问题.
(还有:不,这不是"JQuery:在'内存'而不是DOM中构建HTML"的重复"
1> cletus..：
你可以这样做:
$("#divId").append("").append("").append("").text("some text");
作为:
$("#divId").append("");
要么
$("").text("some text").appendTo(" | ").appendTo("|
").appendTo("").appendTo("#divId");
在你的第三个例子中你可以缩短事件并做$('').text('boldedtext');
2> Marc-André L..：
你可以使用append:
$("#divId").append(
$("").append(
$(" |
").append(
$(" | ").append(
$("").text("some text")
))));
如果你真的坚持,你可以使用appendTo,但它不太直观,速度会慢一些,并且需要更多的按键操作:
$("").text("some text").appendTo(
$(" | ").appendTo(
$("|
").appendTo(
$("").appendTo(
"#divId"
))));
无论如何,使用它.text("...")来逃避特殊字符(并避免XSS攻击)非常重要.
更好的是,当你厌倦了写这些时,你真的想要研究jsrender,胡子,把手,doT或许多javascript模板解决方案中的任何其他.它允许您将代码与HTML分开(想想MVC),并使您更清楚自己构建的内容.修改起来也容易得多.
推荐阅读
-
如何解决《redux-form-通过代码设置字段的值？》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《由于com.sun.javafx.css.StyleManagerloadStylesheetUnPrivileged,JavaFx无法加载@font-face字体》经验，为你挑选了0个好方法。 ...
[详细]
-
如何解决《为什么弹簧传播=所需的跨域嵌套逻辑事务》经验，为你挑选了0个好方法。 ...
[详细]
-
如何解决《为什么这个字符串不会溢出缓冲区？》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《ZuulEdgeServer可以在没有Eureka/Ribbon的情况下使用》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《替换String中的变量》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《明确说明引用的向量长度类型》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《Sitecore8:更改子布局的数据源模板》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《在Windows上设置docker时出错》经验，为你挑选了0个好方法。 ...
[详细]
-
如何解决《在SWRevealViewController上的didselecttableview上出错》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《如何在vi编辑器中搜索带空格和特殊字符的字符串》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《如何获取当前位置和拨出电话摘机时间(确切的呼叫选择时间)？》经验，为你挑选了0个好方法。 ...
[详细]
-
如何解决《Python字典未正确更新》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《通过RESTfulAPI部署Tensorflow模型的示例》经验，为你挑选了2个好方法。 ...
[详细]
-
如何解决《如何在首次启动时显示离子中的应用指令》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《Angular2,VisualStudio2015更新1,类型脚本配置》经验，为你挑选了2个好方法。 ...
[详细]
-
如何解决《如何在Google自定义搜索中指定图像类型》经验，为你挑选了0个好方法。 ...
[详细]
-
如何解决《Postgres创建/恢复在亚马逊ec2上花费了大量时间》经验，为你挑选了0个好方法。 ...
[详细]
-
如何解决《带有多个跨度的文本溢出省略号》经验，为你挑选了1个好方法。 ...
[详细]
-
如何解决《如何在动态生成的表行jquery中添加和操作id》经验，为你挑选了1个好方法。 ...
[详细]
|
京公网安备 11010802040832号