dom 相关问题

OpenUI5：PDFViewer 在显示 pdf 文件时抛出 DOM 错误

我想使用 sap.m.PDFViewer 来显示 UI5 项目中包含的 PDF 文件。文件已找到并加载，但查看器显示默认错误消息，缺点是...

如何让 VS Code 不假设 DOM API 可用？

默认情况下，在 VS Code 中编辑 JavaScript 文件时，它会假设当前上下文中存在 fetch 函数和相关类型。这对于设计为在

DOM API 是面向对象的 API 吗？

请原谅我缺乏对网络技术以及网络相关方面和术语的了解。这个问题的一个答案指出 DOM 标准定义了由

在浏览器中后退和前进时保留 Javascript 更改

我有以下简短的代码来更容易地演示我的问题： 函数变化（）{ document.getElementById('change').innerHTML = "完成！"; } 我有以下简短的代码，可以更轻松地演示我的问题： <script> function change() { document.getElementById('change').innerHTML = "Done!"; } </script> <div id="change" onclick="change();">Change me!</div> 假设文件名为 test.html。 单击 Change me! 时，字符串将更改为 Done!。 Safari、Firefox：当单击浏览器后退按钮，然后单击浏览器前进按钮返回到我的 test.html 时，显示 Done!。这就是我所期待的！ 对其他浏览器（Chrome、Vivaldi、Min、Opera）进行同样的操作，我得到的是 Change me! 而不是 Done!。 当使用后退和前进按钮时，Safari 和 Firefox 似乎保留了 Javascript 更改，而其他浏览器加载页面时没有 Javascript 更改。 有没有办法让其他浏览器达到与 Safari 和 Firefox 相同的行为？ 您可以查看使用浏览器的 Window.sessionStorage 或 Window.localStorage 来存储和检索使用后退按钮/前进按钮的情况下的状态 <script> window.addEventListener("load", function(event) { setHTML(); }) function setHTML() { document.getElementById('change').innerHTML = window.sessionStorage.getItem("state")||"NOT IN FAVORITES"; } function addToFavorites() { window.sessionStorage.setItem("state", "Done"); document.getElementById('change').innerHTML = window.sessionStorage.getItem("state"); } </script> <div id="change" onclick="addToFavorites();">Change me!</div> 您可以使用 event.preventDefault() <script> $(document).ready(function () { $("button").click(function () { $("#test").hide(); **event.preventDefault();** //add this line into your js. }); }); </script> <div> <h2>This is a heading</h2> <p>This is a paragraph.</p> <p id="test">This is another paragraph.</p> <button>Click me</button> </div>

如何在我的页面上找到来源或流氓角色？

我有一个非常简单的基于网络的内部工具。总共有20行css和40行js。 页面上插入了一个 '}' 字符，该字符在 html 中不可见 这是屏幕截图

使用php删除Xml数据

如何使用 php 删除 xml 上的特定元素 my.xml 这里 ...

在javascript中获取href和src属性的原始值

给定一个 HTML 元素，我想使用 Javascript 获取其 src 属性的原始值。 如果 src 值为相对路径，则 element.src 返回绝对路径。 例如： //ssss.com ==> h...

使用 JavaScript 删除 head 标签内的 noscript 标签

我正在尝试使用 JavaScript 删除 标签。但迄今为止的每一次尝试都失败了。 我尝试过这些： // noscript 标签有一个 id。我通过这个 id 访问它 var noscript = 窗口。</desc> <question vote="0"> <p>我正在尝试使用 JavaScript 删除 <pre><code>&lt;noscript&gt;</code></pre> 标签。但迄今为止的每一次尝试都失败了。</p> <p>我尝试过这些：</p> <pre><code>// The noscript tag has a id. I&#39;m accessing it over this id var noscript = window.document.getElementById(&#34;noscript_with_id&#34;); noscript.parentNode.removeChild(noscript); // noscript.parentNode is null noscript.outerHTML = &#34;&#34;; // doesn&#39;t do anything noscript.innerHTML = &#34;&#34;; // doesn&#39;t do anything </code></pre> <p>我不能使用 jQuery。只是简单的 JavaScript。</p> <p>由于我通过特定 ID 访问元素并使用其内容，因此可行的解决方案可能是更改 ID 或清空内容。我需要删除它，因为使用该元素的代码可能会执行多次。</p> <p>noscript 标签位于 <pre><code>&lt;head&gt;</code></pre> 标签内。我用它来异步加载一些样式表。</p> <p>我设置了一个有问题的页面。 <a href="https://blitz.icon-craft.net/layout_test/" rel="nofollow">https://blitz.icon-craft.net/layout_test/</a><br/> 检查控制台并<a href="https://blitz.icon-craft.net/includes/js/loadCSS.js" rel="nofollow">https://blitz.icon-craft.net/includes/js/loadCSS.js</a></p> <p><em>（我想指出，这个网站实际上使用了 jQuery。但我计划在不使用它的网站上使用该脚本。仅对于这个小脚本，包括 jQuery 是没有任何意义的。）</em></p> </question> <answer tick="false" vote="2"> <p>假设 <pre><code>&lt;head&gt;</code></pre> 标签是父标签。 </p> <pre><code>var noscript = document.getElementsByTagName(&#39;noscript&#39;); var parent = document.getElementsByTagName(&#39;head&#39;)[0]; for(var i in noscript) { parent.removeChild(noscript[i]); } </code></pre> <p>我在 SO 网站上对此进行了测试，它有效。 <pre><code>noscript</code></pre> 标签位于 <pre><code>body</code></pre> 标签内，因此选择 <pre><code>body</code></pre> 标签的代码明显不同。 </p> <p>如果 <pre><code>noscript</code></pre> 标签具有不同的父级，则会失败。只有那些范围在您选择的父级范围内的才会被删除。</p> </answer> <answer tick="true" vote="2"> <p>我发现了问题所在。删除元素的工作原理与此处描述的多次相同，就像我正在做的那样。</p> <p>问题是我更改了父级的内容（在本例中为 <pre><code>&lt;head&gt;</code></pre> 标签），因此我保存在变量中的对象变得无效。</p> <p>这是不起作用的代码：</p> <pre><code>var noscript = window.document.getElementById(&#34;some_id&#34;); var head = window.document.getElementsByTagName(&#34;head&#34;)[0]; head.innerHTML += noscript.innerHTML; // After that noscript is no longer valid head.removeChild(noscript); // Won&#39;t work </code></pre> <p>以下内容将起作用：</p> <pre><code>var noscript = window.document.getElementById(&#34;some_id&#34;); var head = window.document.getElementsByTagName(&#34;head&#34;)[0]; var content = noscript.innerHTML; head.removeChild(noscript); head.innerHTML += content; </code></pre> <p>无论如何，谢谢你的帮助。</p> </answer> <answer tick="false" vote="1"> <p>首先需要确保调用javascript时该标签存在。我通过等待所有元素、图像和脚本都已加载来完成此操作。</p> <p>接下来，您不需要使用 id - 您可以使用任意数量的方法来获取它。 getElementsByTagName 返回的 NodeList 是 <em>live</em>，因此，更改大小以反映对其表示的元素集合的操作 - 这就是为什么只需要一次调用 <pre><code>getElementsByTagName</code></pre>。</p> <p>我忘记了具体内容，但前几天我读到过。 querySelector/querySelectorAll 可能是奇怪的 - 返回一个不会像文档那样改变的数组。不知道，无论如何，这里可能大多无关紧要。</p> <p>这是一个工作示例：</p> <p><strong>编辑：</strong>代码已更改。 (1) 按下按钮时触发，这样您就可以在浏览器的 JS 工具的 DOM 查看器中看到效果。 (2) 将noscript标签移至头部</p> <pre><code>&lt;!doctype html&gt; &lt;html&gt; &lt;head&gt; &lt;noscript&gt;You appear to have javascript disabled&lt;/noscript&gt; &lt;script&gt; window.addEventListener(&#39;load&#39;, onDocLoaded, false); function onDocLoaded(evt) { // nukeNoscripts(); } function nukeNoscripts() { var tgtTags = document.getElementsByTagName(&#39;noscript&#39;); alert(&#34;Num of noscript tags: &#34; + tgtTags.length); var tgt = tgtTags[0]; tgt.parentNode.removeChild(tgt); alert(&#34;Num of noscript tags: &#34; + tgtTags.length); } &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;button onclick=&#39;nukeNoscripts()&#39;&gt;NUKE&lt;/button&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> </answer> <answer tick="false" vote="0"> <p>使用 JavaScript 删除 noscript 标签 </p> <pre><code>var noscr = document.getElementsByTagName(&#39;noscript&#39;).length; for(var yh = 0;yh&lt;noscr;yh++) {document.getElementsByTagName(&#39;noscript&#39;)[0].remove();} </code></pre> </answer> <answer tick="false" vote="0"> <p>所有答案都不适合我，而且我的正文中有“noscript”标签。下面的代码最终起作用了：</p> <pre><code>var elem = document.querySelector(&#39;noscript&#39;); elem.parentNode.removeChild(elem); </code></pre> </answer> <answer tick="false" vote="0"> <p>这是一个简单的方法来做到这一点</p> <p></p><div data-babel="false" data-lang="js" data-hide="false" data-console="true"> <div> <pre><code>document.querySelectorAll(&#34;[unwrap]&#34;).forEach(function(a){a=a.textContent;a=document.createRange().createContextualFragment(a);document.body.appendChild(a)});</code></pre> <pre><code> &lt;noscript unwrap&gt; &lt;link href=&#34;some_css.css&#34; rel=&#34;stylesheet&#34;&gt; &lt;h1&gt;Hello World&lt;/h1&gt; &lt;/noscript&gt;</code></pre> </div> </div> <p></p> </answer> </body></html>

如何使用 jquery 删除 noscript 标签包装？

我想删除环绕图像的 noscript 标签： <img src="some_image.jpg"> 我尝试了 unwrap()，...

如何在 React Web 应用程序 (Firefox) 中重置视频和源 DOM 内存组

我正在开发一个实时媒体播放器 React 应用程序，该应用程序在浏览器（特别是 Firefox）中交替显示全屏和元素。 我特别关心的是记忆。

如何使用querySelector从列表中删除特定元素？

我设置了一个带有两个标题和两个按钮的网页。在按下任何按钮之前，该网页看起来与以下内容完全相同： Counter-1：（某个数字） [按钮] Counter-2：（某个数字） [按钮] ...

原生 JS 相当于 jQuery 委托

动态创建的 dom 元素上的事件委托的本机实现是什么？ 我尝试查看 jQuery 源代码，但无法遵循 .on 方法。 注意：目前我附上 ev...

为什么 document.getElementById 不能在函数中工作

`为什么它在函数之外工作？怎么了？我不明白......尝试添加返回语句 - 仍然没有。 [[在此处输入图像描述](https://i.stack.imgur.com/ZWAvj.png)](https...

CSS 中的堆叠

我正在尝试理解CSS中的堆叠。根据我在网上阅读的内容，以下是堆叠顺序： 构成堆叠上下文的元素的背景和边框 定位后代...

如何访问文档对象模型？

我正在学习如何使用 javascript 操作 DOM。 我理解JS只能在浏览器环境中访问DOM，因为DOM只能在浏览器中使用，而JS，是一个“

querySelectorAll 未在递归函数内返回更新的节点列表

我正在尝试抓取将来创建的 DOM 中的一个元素。为了简单起见，当用户通过单击上传按钮上传图像时，会在 DOM 中创建一个 div，它有一个类 ...

获取被激发（触发）的事件的名称（类型）

我有以下代码： $('#button').on('点击更改', function() { alert('谁解雇了我，点击还是更改？'); }); 我如何知道调用的事件是“单击”还是“更改”？

如何定位具有相同类名和文本的元素，如下所示

我需要单击列表中的元素，但无法单击我正在使用的元素（//[@class="pb-dropdown__contents pb-dropdown__contents--no-margin pb-dropdown__con ...

为什么代码不允许网页向下滚动？

从 selenium 导入 webdriver # 创建网络驱动实例 驱动程序 = webdriver.Chrome() # 导航到页面 driver.get('https://www.youtube.com/@freecodecamp/videos') # 向下滚动到

localStorage Javascript代码可以在HTML文件中工作，但不能在Javascript文件中工作，我已经尝试了很多StackOverflow解决方案

我正在尝试使用基本的本地存储方法。它们在 HTML 中完美工作，但在独立的 Javascript 文件中不起作用。 HTML 代码（作品）： 我正在尝试使用基本的本地存储方法。它们可以在 HTML 中完美查找，但不能在独立的 Javascript 文件中工作。 HTML 代码（有效）： <!DOCTYPE html> <html> <head> <title>Test Javascript</title> <meta name="description" content="Our first page"> <meta name="keywords" content="html tutorial template"> <script> document.addEventListener("DOMContentLoaded", function(event) { localStorage.setItem("Name", "Jeff"); console.log(localStorage.getItem("Name")); }); </script> </head> <body> Content goes here. </body> </html> JS 代码（不起作用）： document.addEventListener("DOMContentLoaded", function(event) { localStorage.setItem("Name", "Jeff"); console.log(localStorage.getItem("Name")); }); 或 document.addEventListener("load", function() { localStorage.setItem("Name", "Jeff"); console.log(localStorage.getItem("Name")); }); 或 document.addEventListener("DOMContentLoaded", function() { localStorage.setItem("Name", "Jeff"); console.log(localStorage.getItem("Name")); }, false); 或 window.onload = function() { localStorage.setItem("Name", "Jeff"); console.log(localStorage.getItem("Name")); } 以下是我尝试过的解决方案： 使用document.addEventListener("DOMContentLoaded", function(event) {}); 使用document.addEventListener("load", function() {}); 使用document.addEventListener("DOMContentLoaded", function() {}, false); 使用window.onload = function() {} 使用window.onload = function() {}（再次） 使用window.onload = function() {}（再次...） 运行 js 文件时，我仍然得到相同的结果：localStorage 中没有任何反应，并且我在控制台中看不到任何内容。 我不知道从这里去哪里，任何帮助将不胜感激。 Web 浏览器仅在加载了 <script> 元素的 HTML 文档上下文中执行 JavaScript（src 属性允许从 URL 加载脚本，而不是嵌入到 HTML 文档中）。 （让我们忽略浏览器扩展、将内容粘贴到开发人员工具和书签中，因为它们与此处无关）。 只需输入 JavaScript 程序的 URL 即可使其源代码显示在主视口中。它不会执行代码。没有办法让它执行 HTML 文档之外的代码。