dom 相关问题

如何添加多个段落标签，在 div 容器顶部添加新标签。最近每次点击事件时都添加到顶部最近在顶部添加了段落&... 如何添加多个段落标签，在 div 容器顶部添加新标签。 <div id="pcontainer"> <p>recently added on top every time on click event recently added paragarph on top</p> <p>added before recent</p> </div> 我正在使用追加，但每次单击按钮时，它都会添加到底部，我需要将它添加到所有段落的顶部，请帮忙。您可以使用 prepend 将段落添加到容器顶部： // HTML: <div><p>Lorem ipsum</p></div> $('div').prepend('<p>Bla bla bla'); 更新：关于您关于如何淡入段落的评论 - 使用 fadeIn： $("#pcontainer").prepend($('<p>This paragraph was added by jQuery.</p>').fadeIn('slow')); 工作演示：http://jsbin.com/uneso 无需 jQuery 的更优雅方式： var container = document.getElementById('pcontainer'); container.insertBefore(document.createElement("p"), container.firstChild); 这假设容器中已经有一个元素。非 jQuery 用户的示例： document.getElementById('pcontainer').innerHTML = '<p>new paragraph</p>' + document.getElementById('pcontainer').innerHTML; 也许没有那么短和漂亮:) 尝试使用 prepend 而不是append。这是一种不使用 jQuery 的方法： function prependParagraphs() { var choosenDiv = document.getElementById("pcontainer"); for(var i=0; i<5; i++) { var newP = document.createElement("p"); var text = document.createTextNode("new paragraph number: " + i); newP.appendChild(text); choosenDiv.insertBefore(newP, choosenDiv.firstChild); } } 具体到您的 HTML，它将是： $("#pcontainer").prepend('<p>here's a new paragraph!</p>'); 你可以使用一个小技巧。例如，首先将新的 html 存储在变量中，然后将其与旧内容一起附加到容器中。 const container = document.getElementById("pcontainer") container.innerHTML = `<p>new para you want to add</p> ${container.innerHTML}` 不使用 jquery 的更新解决方案是使用 prepend() 方法。 function add() { let p = document.createElement('p') p.innerText = 'added before' document.getElementById('pcontainer').prepend(p) } button = document.getElementById('add') button.addEventListener('click', add) <button id="add">add</button> <div id="pcontainer"> <p>begin</p> </div>

javascript jquery dom

回答 8 投票 0

输入类型日期的操作如何工作？

所以我试图创建一个页面，要求用户输入一些信息，包括生日，然后在最初的空白区域中显示这些信息，但我想知道如果 <

javascript html forms dom

回答 1 投票 0

如何对对象内部数组中的所有元素求和并显示到 DOM 或 HTML elemnet？

我无法向浏览器显示对象内部数组元素的总和。这是我的 JavaScript 代码：常量产品 = { 产品名称： []，描述： []，数量： []，

javascript dom

回答 1 投票 0

js TouchEvent：两根手指捏合并抬起一根手指时，如何知道哪根手指抬起了？

我正在做一个复杂的触摸手势，遇到这个问题：让cachedStartTouches：TouchList；让cachedMoveTouches：TouchList；函数 onStart(ev: TouchEvent) { // 长度等于 2 ...

javascript html typescript dom touch

回答 1 投票 0

输入栏的数字转换后如何得到正确的输出数字？

我被另一个程序困住了，我似乎无法正确执行。对于本例，我有一个 index.html 文件（我无法更改其中的任何内容）和我为其制作的 js 代码。在这种情况下，我需要添加日志...

javascript html dom events inputevent

回答 1 投票 0

从每个分页的DataTable中获取并保存元素信息

我当前正在使用 sql 查询在页面加载时从数据库中检索信息。查询的结果是一个php数组$data[]，它通过DataTables插件（jquery）传递...

javascript dom datatable pagination

回答 1 投票 0

如何在 JavaScript 中将通配符元素名称与“querySelector()”或“querySelectorAll()”进行匹配？

有没有办法使用querySelector或querySelectorAll进行通配符元素名称匹配？我试图解析的 XML 文档基本上是一个简单的属性列表我需要找到...

javascript dom css-selectors domparser selectors-api

回答 8 投票 0

使用 MutationObserver 仅观察特定属性的属性变化

我有一个项目列表，我正在使用 Mutation Observer 来检查项目是否从该列表中添加或删除。代码如下所示：函数 TrackListChange(elementId) {

javascript jquery html dom mutation-observers

回答 2 投票 0

为什么前端框架可以创建自定义属性，但我希望在我的前面添加“data-”

为什么前端框架能够在 html 元素上创建自定义属性，例如以 Vue 为例如果我自己编造的话，Html 验证器就会抱怨。为什么前端框架能够在 html 元素上创建自定义属性，例如以 Vue 为例 <div v-for="..."> 如果我自己编写，Html 验证器会抱怨。 <div something> 告诉我我应该像这样假装数据 <div data-something> 我了解一致性和标准的重要性。但我很好奇前端框架是否在幕后做一些特殊的事情来规避这个规则。或者他们只是忽略了它？关于Vue：您为 Vue 提供的 HTML 不是渲染的 HTML。它由 Vue 编译成创建虚拟 DOM 的 JS 代码。然后，Vue 默认渲染器将其转换为实际的“正确”HTML，而无需 v-for 和其他指令。如果您想验证 HTML - 验证呈现的 HTML 页面。 Vue 模板是伪 HTML，有助于为虚拟 DOM 创建渲染功能，从而提高可读性并让设计师等非程序员参与其中。我想其他框架也是如此 - 您应该验证最终渲染的 HTML。

html dom frontend w3c-validation

回答 1 投票 0

HTML DOM：无法以编程方式编辑元素值

我正在尝试自动化某些网站上的一些任务，包括Google Finance。但是，当我尝试编辑 Google 财经搜索输入中的输入值时，它根本不起作用。有没有人可以...

javascript html dom google-chrome-extension

回答 1 投票 0

DOM 元素更新非常慢

我正在编写这个初学者石头剪刀布游戏。添加了事件监听器。不知怎的，它的工作方式非常奇怪。当我点击武器时，每次点击之间有大约 2 秒或更长时间的延迟 - 它起作用了......

javascript function performance dom event-handling

回答 1 投票 0

MUI 仅处理 onBlur 和 onKeyPress 之一

我目前正在处理一个 TypeScript 和 Material-UI 项目。我的目标是管理 TextField 组件的 onBlur 事件和 onEnter 按键事件。场景如下：我已经集成了

javascript reactjs typescript dom material-ui

回答 1 投票 0

org.w3c.dom.DOMException：NAMESPACE_ERR：从 Java8 迁移到 Java17

我们有两个有一定用途的应用程序一个应用程序是基于 Eclipse GUI 的桌面 UI 应用程序 - 使用 Java8 和 Eclipse Ganymede 最近从...迁移的第二个应用程序

java xml spring-boot dom soap

回答 1 投票 0

Hostinger Website Builder，嵌入的Javascript无法访问文档正文

我有一个 Hostinger 网站构建器创建的网站，我正在尝试通过 Javascript 使用其数据属性进行访问，将标题添加到锚标记。我检查了有问题的网页...

javascript dom

回答 1 投票 0

onClick事件。更换React组件后detail未重置

onClick event.detail 包含点击次数：双击有 event.detail = 2。当点击的React组件被替换时，event.detail不会重置。我怀疑这是因为 R...

javascript reactjs dom onclick dom-events

回答 1 投票 0

dom 相关问题

最新问题