我可以使用jQuery创建一个DOM元素而不在DOM中吗？ - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

浏览器中的JavaScript：文档对象模型与 DOM 操作

8 9 在这个结构的顶部有一个文档，也称为根元素，它包含另一个元素：html。 html 元素包含一个 head ，而 head 内又有一个 title。...需要理解的也是最重要的概念是，我们主要使用 DOM 中的两种类型的节点： Element 类型的节点（HTML 元素） Text 类型的节点（文本节点）为了创建 Element 类型的新节点，本机 DOM...我们不是一步一步地去命令浏览器，而是声明我们需要什么 HTML 元素，而库可以处理剩下的部分。 DOM 操作和 jQuery 此时你可能会想：“我可以只使用jQuery吗？...甚至可以创建自己的迷你框架来抽象出最常见的操作：创建元素、追加、创建文本等。结论文档对象模型是浏览器创建并保留在内存中的网页的虚拟副本。...DOM 中可用的每个HTML 元素都有一个暴露一定数量属性和方法的接口。如果对使用什么方法有疑问，可以参考 MDN上的优秀文档。

6581 0

关于虚拟DOM（面试必看）

这段字符串的内容，其实就是一份标准的、可用于渲染的 HTML 代码，它将对应一个 DOM 元素。...虚拟 DOM 的价值在整个 DOM 操作的演化过程中，主要矛盾并不在于性能，而在于开发者写得爽不爽，在于研发体验/研发效率。...因为虚拟 DOM 的劣势主要在于 JS 计算的耗时，而 DOM 操作的能耗和 JS 计算的能耗根本不在一个量级，极少量的 DOM 操作耗费的性能足以支撑大量的 JS 计算上面讨论的这种情况相对来说比较极端...在实际的开发中，更加高频的场景是这样的：我每次 setState 的时候只修改少量的数据，比如一个对象中的某几个属性，再比如一个数组中的某几个元素。...在这样的场景下虚拟 DOM 就比较快，那什么场景下虚拟 DOM 慢呢？首次渲染或微量操作，虚拟 DOM 的渲染速度就会比真实 DOM 更慢那虚拟 DOM 一定可以规避 XSS吗？

1511 0

您找到你想要的搜索结果了吗？

是的

没有找到

Javascipt异步与同步

我在使用jquery ajax异步请求时面临到了这样一个问题： var ccc = $("#content") $.ajax({ url: 'https://cnodejs.org...id为con的添加点击事件,这种情况下肯定是会报错了,原因是jquery-ajax默认是异步的,哪这种情况下当执行到获取dom元素时,是获取不到的,因为ajax的没有执行。...我想到的解决办法是: 改为同步(把async: false)这样的话,就会按照顺序执行,从而获取到id为con的dom元素。...可是这样又会面临一个问题: 阻塞,如果返回的数据量很大的情况下,就会一直等待数据的返回,导致页面的卡顿。哪有没有即是异步又可以获取dom的元素的呢。...content').on('click','#con',function() { console.log('成功获取#con') }); 如果我不想使用jquey的on或者其他事件,我可以实现吗？

8602 0

DOM 高级工程师不完全指南

三年前我初入前端坑的时候，发现了一个叫做 jQuery 的宝贝，她有一个神奇的 $ 函数，可以让我快速选中某一个或一组 DOM 元素，并提供链式调用以减少代码的冗余。...而老大哥 jQuery 可以简化为： ? 但，各位观众，如今原生 JavaScript 也可以实现这一操作了： ?...移动 DOM 元素上面提到的兄弟方法 insertAdjacentElement 也可以用来对已存在的元素进行移动，换句话说：当传入该方法的是已存在于文档中的元素时，该元素仅仅只会被移动（而不是复制并移动...而如今，开发者们可以使用 replaceWith 就可以完成两个元素之间的替换了： ? 从用法上来说，要比前者清爽一些。...用 HTML 字符串创建 DOM 元素细心的你一定发现了，上文提到的 insertAdjacent 方法允许开发者直接将一段 HTML 插入到文档当中，如果我们此刻只想生成一个 DOM 元素以备将来使用呢

7351 0

为什么越来越少的人用 jQuery？

我来分以下几点，阐述我的想法：一、JS更新带来的冲击： 1.快速选取DOM节点对于大部分使用jQuery的开发工程师来说，能够快速选取DOM节点，这个无疑是一个重要的原因，但是就目前情况来说，这个优势显然已经荡然无存了...Vue中也是使用此API进行元素获取的： ? 所以说jQuery快速选择DOM节点的优势已经不存在了。...在传统开发模式中，这时的换一换按钮肯定执行的还是上面的代码，获取元素，修改元素的innerHTML，但是现在问题出现了，就是我们有必要将所有元素重新删除，再重新添加一遍吗？...答案肯定是不需要（下图所示，创建一个元素的代价有多大）。 ? 因为这时我们只需要将每一个li里的文字和a标签里的链接修改即可，那显然是没有必要像上面那样重新再添加一遍li的。...因为一个DOM元素，可能包含上百条属性，这对性能开销是很大的。那么现在出现的新概念 Virtual DOM（虚拟DOM），就可以解决这个问题。

9473 0

jquery面试题目_高并发面试题

你是如何将一个 HTML 元素添加到 DOM 树中的？（答案如下）你可以用 jQuery 方法 appendTo() 将一个 HTML 元素添加到 DOM 树中。...这是 jQuery 提供的众多操控 DOM 的方法中的一个。你可以通过 appendTo() 方法在指定的 DOM 元素末尾添加一个现存的元素或者一个新的 HTML 元素。 10....而 this 代表当前元素，它是 JavaScript 关键词中的一个，表示上下文中的当前 DOM 元素。你不能对它调用 jQuery 方法，直到它被 () 函数包裹，例如 12....(答案) 尽管 detach() 和 remove() 方法都被用来移除一个DOM元素, 两者之间的主要不同在于 detach() 会保持对过去被解除元素的跟踪, 因此它可以被取消解除, 而 remove...你也还可以看看用来向DOM中添加元素的 appendTo() 方法. 15. 你如何利用jQuery来向一个元素中添加和移除CSS类?

9.4K1 0

求职 | 史上最全的web前端面试题汇总及答案2

全局函数isNaN可以判断一个变量的值是否为数字。可以使用运算符type、instanceof判断变量值的数据类型。 6、什么是Bom什么是Dom?你如何理解Dom?...JQuery 1、你使用过jQuery吗？如果有，你为什么要使用jQuery呢？ ①用过。...②如果使用原生javascript开发的话，会面临很多问题，如浏览器兼容、Ajax数据解析、Dom、事件注册操作等都非常烦锁，而jQuery正好解决了这些问题。...如何创建新的节点？可以使用html()获取html内容。使用text()获取文本内容。使用attr()可以获取属性值，使用css()可以获取样式属性值。...通过val()便可以获取input的值把节点元素名加上作为参数调用jQuery方法便可创建新节点,如：jQuery(“”)。 5、如何向页面插入节点？

6.1K2 0

第九篇：真正理解虚拟 DOM：React 选它，真的是为了性能吗？

这段字符串的内容，其实就是一份标准的、可用于渲染的 HTML 代码，它将对应一个 DOM 元素。最后，将这个 DOM 元素挂载到页面中去，整个模板的渲染流程也就走完了。...读到这里，相信你至少已经 get 到了这样一个点：在整个 DOM 操作的演化过程中，主要矛盾并不在于性能，而在于开发者写得爽不爽，在于研发体验/研发效率。...因为虚拟 DOM 的劣势主要在于 JS 计算的耗时，而 DOM 操作的能耗和 JS 计算的能耗根本不在一个量级，极少量的 DOM 操作耗费的性能足以支撑大量的 JS 计算。...在实际的开发中，更加高频的场景是这样的：我每次 setState 的时候只修改少量的数据，比如一个对象中的某几个属性，再比如一个数组中的某几个元素，在这样的场景下，模板渲染和虚拟 DOM 之间 DOM...前面又是分析又是举例地说了这么多，其实我最终希望你明白的事情只有一件：虚拟 DOM 的价值不在性能，而在别处。因此想要从性能角度来把握虚拟 DOM 的优势，无异于南辕北辙。

7243 0

DOM 高级工程师不完全指南

三年前我初入前端坑的时候，发现了一个叫做 jQuery 的宝贝，她有一个神奇的 $ 函数，可以让我快速选中某一个或一组 DOM 元素，并提供链式调用以减少代码的冗余。...而老大哥 jQuery 可以简化为： ? 但，各位观众，如今原生 JavaScript 也可以实现这一操作了： ?...移除 DOM 元素上面提到的兄弟方法 insertAdjacentElement 也可以用来对已存在的元素进行移动，换句话说：当传入该方法的是已存在于文档中的元素时，该元素仅仅只会被移动（而不是复制并移动...而如今，开发者们可以使用 replaceWith 就可以完成两个元素之间的替换了： ? 从用法上来说，要比前者清爽一些。...用 HTML 字符串创建 DOM 元素细心的你一定发现了，上文提到的 insertAdjacent 方法允许开发者直接将一段 HTML 插入到文档当中，如果我们此刻只想生成一个 DOM 元素以备将来使用呢

7231 0

为什么越来越少的人用 jQuery？

我来分以下几点，阐述我的想法： JS更新带来的冲击 1.快速选取DOM节点对于大部分使用jQuery的开发工程师来说，能够快速选取DOM节点，这个无疑是一个重要的原因，但是就目前情况来说，这个优势显然已经荡然无存了...querySelectorAll兼容图从图中可以看到，这两个API已经很好的兼容各个浏览器。 Vue中也是使用此API进行元素获取的： ? 所以说jQuery快速选择DOM节点的优势已经不存在了。...在传统开发模式中，这时的换一换按钮肯定执行的还是上面的代码，获取元素，修改元素的innerHTML，但是现在问题出现了，就是我们有必要将所有元素重新删除，再重新添加一遍吗？...答案肯定是不需要（下图所示，创建一个元素的代价有多大）。 ?...因为一个DOM元素，可能包含上百条属性，这对性能开销是很大的。那么现在出现的新概念Virtual DOM（虚拟DOM），就可以解决这个问题。

1.3K2 1

尤大 4 天前发在 GitHub 上的 vue-lit 是啥？

而 lit-html 就不一样了，它是基于 tagged template 的，使得它不用编译就可以在浏览器上运行，并且和 HTML Template 结合想怎么玩怎么玩，扩展能力更强，不香吗？...: 通过 lit-html 渲染元素，并且会创建 ShadowDOM 总之，lit-element 遵守 Web Components 标准，它是一个 class，基于它可以快速创建 Web Component...说 Web Components 之前我想先问问大家，大家还记得 jQuery 吗，它方便的选择器让人难忘。...浏览器原生 API 已经足够好用，我们并不需要为了操作 DOM 而使用 jQuery。 You Dont Need jQuery[5] 再后来，是不是很久没有直接操作过 DOM 了？...组件化像 React / Vue 等框架（库）都做了同样的事情，在之前浏览器的原生能力是实现不了的，比如创建一个可复用的组件，可以渲染在 DOM 中的任意位置。现在呢？

7685 0

最常见的 20 个 jQuery 面试问题及答案

你是如何将一个 HTML 元素添加到 DOM 树中的？（答案如下）　　你可以用 jQuery 方法 appendTo() 将一个 HTML 元素添加到 DOM 树中。...这是 jQuery 提供的众多操控 DOM 的方法中的一个。你可以通过 appendTo() 方法在指定的 DOM 元素末尾添加一个现存的元素或者一个新的 HTML 元素。　　10....你也还可以看看用来向DOM中添加元素的 appendTo() 方法. 　　15. 你如何利用jQuery来向一个元素中添加和移除CSS类?...你是如何将一个 HTML 元素添加到 DOM 树中的？（答案如下）　　你可以用 jQuery 方法 appendTo() 将一个 HTML 元素添加到 DOM 树中。...你也还可以看看用来向DOM中添加元素的 appendTo() 方法. 　　15. 你如何利用jQuery来向一个元素中添加和移除CSS类?

13.8K3 0

尤大 3 天前发在 GitHub 上的 vue-lit 是啥？

而 lit-html 就不一样了，它是基于 tagged template 的，使得它不用编译就可以在浏览器上运行，并且和 HTML Template 结合想怎么玩怎么玩，扩展能力更强，不香吗？...: 通过 lit-html 渲染元素，并且会创建 ShadowDOM 总之，lit-element 遵守 Web Components 标准，它是一个 class，基于它可以快速创建 Web Component...说 Web Components 之前我想先问问大家，大家还记得 jQuery 吗，它方便的选择器让人难忘。...浏览器原生 API 已经足够好用，我们并不需要为了操作 DOM 而使用 jQuery。 You Dont Need jQuery[5] 再后来，是不是很久没有直接操作过 DOM 了？...组件化像 React / Vue 等框架（库）都做了同样的事情，在之前浏览器的原生能力是实现不了的，比如创建一个可复用的组件，可以渲染在 DOM 中的任意位置。现在呢？

9452 0

尤大几天前发在 GitHub 上的 vue-lit 是啥？

而 lit-html 就不一样了，它是基于 tagged template 的，使得它不用编译就可以在浏览器上运行，并且和 HTML Template 结合想怎么玩怎么玩，扩展能力更强，不香吗？...: 通过 lit-html 渲染元素，并且会创建 ShadowDOM 总之，lit-element 遵守 Web Components 标准，它是一个 class，基于它可以快速创建 Web Component...说 Web Components 之前我想先问问大家，大家还记得 jQuery 吗，它方便的选择器让人难忘。...浏览器原生 API 已经足够好用，我们并不需要为了操作 DOM 而使用 jQuery。 You Dont Need jQuery[5] 再后来，是不是很久没有直接操作过 DOM 了？...组件化像 React / Vue 等框架（库）都做了同样的事情，在之前浏览器的原生能力是实现不了的，比如创建一个可复用的组件，可以渲染在 DOM 中的任意位置。现在呢？

1.4K2 0

尤大 3 天前发在 GitHub 上的 vue-lit 是啥？

而 lit-html 就不一样了，它是基于 tagged template 的，使得它不用编译就可以在浏览器上运行，并且和 HTML Template 结合想怎么玩怎么玩，扩展能力更强，不香吗？...: 通过 lit-html 渲染元素，并且会创建 ShadowDOM 总之，lit-element 遵守 Web Components 标准，它是一个 class，基于它可以快速创建 Web Component...说 Web Components 之前我想先问问大家，大家还记得 jQuery 吗，它方便的选择器让人难忘。...浏览器原生 API 已经足够好用，我们并不需要为了操作 DOM 而使用 jQuery。 You Dont Need jQuery[5] 再后来，是不是很久没有直接操作过 DOM 了？...组件化像 React / Vue 等框架（库）都做了同样的事情，在之前浏览器的原生能力是实现不了的，比如创建一个可复用的组件，可以渲染在 DOM 中的任意位置。现在呢？

9433 0

尤大 3 天前发在 GitHub 上的 vue-lit 是啥？

而 lit-html 就不一样了，它是基于 tagged template 的，使得它不用编译就可以在浏览器上运行，并且和 HTML Template 结合想怎么玩怎么玩，扩展能力更强，不香吗？...: 通过 lit-html 渲染元素，并且会创建 ShadowDOM 总之，lit-element 遵守 Web Components 标准，它是一个 class，基于它可以快速创建 Web Component...说 Web Components 之前我想先问问大家，大家还记得 jQuery 吗，它方便的选择器让人难忘。...浏览器原生 API 已经足够好用，我们并不需要为了操作 DOM 而使用 jQuery。 You Dont Need jQuery[5] 再后来，是不是很久没有直接操作过 DOM 了？...组件化像 React / Vue 等框架（库）都做了同样的事情，在之前浏览器的原生能力是实现不了的，比如创建一个可复用的组件，可以渲染在 DOM 中的任意位置。现在呢？

8663 1

在没有DOM操作的日子里，我是怎么熬过来的（上）

按照我以前的开发经验，如果不直接操作dom，难道vue还有更先进的办法吗？答案是，有的。 vue大法好，应该有的尽量有。...使用jq需要拿到数据后操作dom元素来实现，vue直接用v-for来实现，不需要我们来操作dom元素，在这种程度上，我们其实可以说vue实现了model和view的分离。...既然vue不能直接操作dom，而我又不想完全弃用jQuery，那么请问jQuery和VueJS能否一起使用呢？答案自然是可以的。...如果使用JQuery + VueJS 开发，一定要在 Vue 渲染完所有的 HTML组件之后再通过 JQuery 处理，而使用 JQuery 时应避免直接操作 DOM ，但是应用动画是允许的。...vue的话是一个能提供动态绑定等等功能的一个框架，把你从复杂繁琐的dom操作中解放出来了，代表的是虚拟dom的新思路。

2.2K12 0

jQuery笔试题汇总整理--2018

封装的非常的好，不需要考虑复杂浏览器的兼容性和XMLHttpRequest对象的创建和使用的问题。)...： jQuery(document).ready(function(){ }); 5、jQuery对象和DOM对象是怎样转换的 jQuery对象是一个包含了dom对象的数组可以通过jQuery...对象[下标]获取dom对象将dom对象放入$("")中转为jQuery对象 6、jQuery中$.get()提交和$.post()提交的区别 1、$.get()使用GET方法来进行异步提交 $.post...").insertBefore("p") 你好我想说： 9、jQuery中如何来获取和设置属性可以用attr()获取和设置元素属性 removeAttr...该对象在Internet Explorer 5中首次引入，它是一种支持异步请求的技术。简而言之，XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。

2.5K2 1

angularJS之站在jQuery的肩膀上

jQuery由一小撮对浏览器极其熟稔的极客负责抹平不同浏览器的差异，其他开发者只需要基于jQuery进行开发，可以更好地关注业务实现，而不是把时间花在适配不同的浏览器上。...：引入jquery库 jquery库将创建一个全局对象：$。...它其实是一个类工厂，负责将指定的DOM对象转化为jquery对象。在DOM文档就绪后，启动一个定时器使用$(document).ready()可以监听DOM文档就绪事件，通常简写成$(...)。...在定时器里更新div#clock的文本 "div#clock"是一个选择符，使用这个选择符，jquery库可以找到那个特定的DOM对象，并将其转化为jQuery对象。...Query缺失的环节 jQuery有点像C语言，威力很大，不过要弄出点像样的前端界面，还得花不少功夫处理琐碎的事情。还能再简单些吗？Misko Hevery认为在某些应用场景下可以。

8881 0

25个常规方法优化你的jquery代码

处理DOM插入操作时，将需要的内容包装在一个元素中嗯，不要问我为什么要这样做（我相信一个有相当经验的程序员会给你解释）。在上面的例子中我们使用.html()将1000个item项插入到UL中。...我使用前一个例子，修改它以便于我们创建的每个LI有一个唯一的class。...当执行选择操作时，jQuery函数可以指定第二个参数：jQuery( expression, context )通过给选择器提供一个上下文，那就会在这个context中进行元素查找，而不必在整个DOM文档中查找元素...如果你向DOM中添加了新的元素，尽管这些新元素被选择器所匹配，但是这些新元素并不会绑定上事件处理（你同意我的观点吗？），因此不会有事件发生。 ...当使用事件代理时，你能够在事件被DOM绑定后仍然可以添加多个被匹配的元素到其中，而它们同样能够正常工作。 13. 利用classes存储状态这是在html中存储信息最基本的方法。

1.6K1 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭