首页 > web前端 > js教程 > laconic:一种从JavaScript生成DOM内容的新方法

laconic:一种从JavaScript生成DOM内容的新方法

尊渡假赌尊渡假赌尊渡假赌
发布: 2025-02-27 01:12:10
原创
257 人浏览过

Laconic: a New Way to Generate DOM Content from JavaScript

传统上,JavaScript开发人员使用

innerHTML将内容注入网页。 例如:outerHTML

var container = document.getElementById("container");
container.innerHTML = "<p>Here's some new <strong>DOM</strong> content.</p>";
登录后复制
(注意:jQuery也利用DOM操作。

innerHTML易于错误:无效的HTML可能导致难以删除错误。

    浏览器不一致:对结果的DOM节点上的复杂操作可能会引起浏览器特定问题。>
  1. 非标准:
  2. 不是W3C DOM标准。
  3. 一种更健壮的,尽管冗长,替代方案是基于DOM的方法:>
  4. innerHTML这种方法虽然遵守标准,但更长,较慢,仍然容易受到人为错误的影响。
  5. >输入Laconic,这是一种提供更优雅的解决方案的轻量级实用程序。 它使用简洁的JavaScript语法,该语法将直接映射到HTML:
使用对象文字:

var newpara = document.createElement("p");
var newstrong = document.createElement("strong");
newstrong.appendChild(document.createTextNode("DOM"));
newpara.appendChild(document.createTextNode("Here's some new "));
newpara.appendChild(newstrong);
newpara.appendChild(document.createTextNode(" content."));

var container = document.getElementById("container");
container.appendChild(newpara);
登录后复制
仍然适合快速任务,但当

证明有问题时,LaConic会出色。有关更多详细信息和下载,请参见:

github上的laconic
$.el.p(
    "Here's some new ",
    $.el.strong("DOM"),
    " content."
).appendTo(document.getElementById("container"));
登录后复制

间隙示例页

// Generates <div class="example"><div>Content</div></div>
$.el.div(
    { "class": "example"},
    $.el.div("Content")
);
登录后复制

innerHTML经常询问有关laconic和javascript dom内容生成的问题(常见问题解答) innerHTML

Q:>?
  • >
  • 直接设置元素的HTML内容,可易于使用,但由于HTML解析而引起的潜在安全性和性能弊端。 另一方面,通过编程构建DOM元素,从而获得更好的性能和安全性,但需要更多代码。

    问:>和

    >?

    innerHTML>createElement提供对插入点的更精确的控制,模板文字提供了清洁器html字符串创建。

    问:我如何在jQuery? innerHTML> jQuery的createElement函数的作用与JavaScript的

    相似。例如:

    var newelement = $('innerHTML>');

    Q: Innerhtml <cody> vs. <code> createElement <code>innerHTMLcreateElement

    > 的优点和缺点 <p> <code> innerhtml<code>innerHTML很简单,但较慢且安全较低。 createElement<code>createElement更快,更安全,但更详细。

    >

    Q:如何将laconic用于DOM内容生成? var newElement = $ .El.div({class:'myclass'},'hello,world!'); document.body.body.appendchild(newElement);

    以上是laconic:一种从JavaScript生成DOM内容的新方法的详细内容。更多信息请关注PHP中文网其他相关文章!

    本站声明
    本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
    热门推荐
    热门教程
    更多>
    最新下载
    更多>
    网站特效
    网站源码
    网站素材
    前端模板