dom 相关问题

通过文档对象模型,将此标记用于有关其他语言与XML / HTML交互的问题。不要将其用作HTML,JavaScript或SAX的简写 - 使用其他标记来表示语言和标记。

按钮切换绑定事件bug

重新赋值getRes时,num的打印值保持不变,但重新绑定DOM点击事件时不会出现这个问题。是什么原因导致这个问题呢? 我尝试切换箭头功能,

回答 1 投票 0

事件循环如何处理 JavaScript 中的 DOM 事件处理程序?

我对浏览器如何处理 JavaScript 事件有点困惑。 假设我有两个事件处理程序附加到按钮 A 和 B。这两个事件处理程序花费完全相同的时间来完成。 ...

回答 2 投票 0

同一元素上的 JavaScript DOM 事件处理程序是否按注册顺序调用相同的事件和阶段?

如果我将多个事件处理程序附加到单个 DOM 元素上的单个事件,是否保证事件处理程序按照它们添加的顺序被调用?或者我不应该依赖这种行为?

回答 1 投票 0

JavaScript DOM 中事件目标的父链中事件监听器的顺序是如何确定的?

假设有一个 div 包含一个链接(a href),并且有三个事件侦听器 - 单击时 - 1)整个页面,2)div 3)标签。如果用户点击a标签,列表如何...

回答 1 投票 0

JavaScript DOM 事件处理程序是否按照注册顺序调用?

如果我将多个事件处理程序附加到单个 DOM 元素上的单个事件,是否可以保证事件处理程序按照添加顺序进行调用?或者我不应该依赖这种行为?

回答 1 投票 0

如何测量首屏油漆?

Web Vitals 具有两个众所周知的指标:FCP 和 LCP。测量绘画时间是个好主意。但我有不同的问题。 我必须实现一个描述第一个屏幕何时出现的指标

回答 1 投票 0

createElement() 在将元素追加到 DOM 之前是否会触发回流?令人困惑的 abt DocumentFragment 行为

我试图弄清楚创建元素时何时触发回流或重绘。 其上下文试图了解如果元素是...

回答 1 投票 0

为什么我无法从LI获取DIV子元素?

为什么代码总是返回 false? 为什么我无法从 LI 获取 DIV 子元素? 让 li = document.getElementById('ul').children 控制台.log(li) 对于(i=0;i 为什么代码总是返回 false? 为什么我无法从 LI 获取 DIV 子元素? let li = document.getElementById('ul').children console.log(li) for(i=0;i<li.length;i++) li.hasChildren ? console.log("true") : console.log("false")// only false <div id="conteinerTask2"> <ul id="ul"> <li class= "el">Element 1 <div class="el-txt">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem eum quibusdam obcaecati sunt nulla, culpa nesciunt quas in officia sit. Illo aliquam beatae amet eos placeat neque, earum officiis ratione reiciendis exercitationem.</div></li> <li class= "el">Element 2 <div class="el-txt">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Accusamus ex commodi, laudantium corrupti nam quos.</div></li> <li class= "el">Element 3 <div class="el-txt">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Ipsa obcaecati delectus nulla aperiam sint sit aliquam natus! Voluptatum, minima libero.</div></li> <li class= "el">Element 4 <div class="el-txt">Lorem ipsum, dolor sit amet consectetur adipisicing.</div> </li> </ul> </div> 首先,在 for 循环中,您仅访问 li 元素的 集合,而不是单独访问每个 li,因为您不通过索引访问它们。 其次,没有hasChildren属性。您可以使用 children.length > 0 来代替。 let li = document.getElementById('ul').children for (i = 0; i < li.length; i++) { li[i].children.length > 0 ? console.log("true") : console.log("false") // only false } <div id="conteinerTask2"> <ul id="ul"> <li class="el">Element 1 <div class="el-txt">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem eum quibusdam obcaecati sunt nulla, culpa nesciunt quas in officia sit. Illo aliquam beatae amet eos placeat neque, earum officiis ratione reiciendis exercitationem.</div> </li> <li class="el">Element 2 <div class="el-txt">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Accusamus ex commodi, laudantium corrupti nam quos.</div> </li> <li class="el">Element 3 <div class="el-txt">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Ipsa obcaecati delectus nulla aperiam sint sit aliquam natus! Voluptatum, minima libero.</div> </li> <li class="el">Element 4 <div class="el-txt">Lorem ipsum, dolor sit amet consectetur adipisicing.</div> </li> </ul> </div>

回答 1 投票 0

javascript:无法在函数中使用全局变量来导航 dom

这里是初学者... 我缺少什么? 我定义了一个全局变量,它是对 html 元素的引用: var x=document.getElementById("xxx1"); 然后,在函数内部尝试引用...

回答 5 投票 0

Snabbdom - 无法将 TR 添加到表顶部而不完全重新渲染行

我正在尝试向表中添加和删除表行,而不重新呈现所有未修改的行。当我将行添加到表末尾时,现有行不会重新呈现,并且...

回答 1 投票 0

如何让 Firefox 扩展等待页面内容的获取请求?

我的 JavaScript 从页面获取 HTML dom 元素,但页面必须发出 HTML get 请求才能获取 HTML 内容。如何让我的脚本在收到的 HTML 而不是默认的 HTML 上运行。 ...

回答 1 投票 0

将 JavaScript 输出打印为 HTML

第一次在这里发帖,请多多包涵!我正在学习 JavaScript 课程,我们正在制作一个网页,该网页会随着 Unix 纪元以来的时间而更新。这个

回答 1 投票 0

JavaScript 未添加输入

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Youtube Card</title> <style> .container { display: flex; align-items: center; justify-content: space-around; width: 900px; height: 198px; border: 2px solid black; background-color: black; } .box { height: 190px; margin: 4px; /* border: 2px solid grey; */ border-radius: 15px; } .photo { width: 180px; overflow: hidden; } .textbox { width: 681px; color: azure; display: flex; flex-direction: column; align-items: center; justify-content: center; } #img { position: absolute; overflow: hidden; } .numberbox { height: 17px; width: 43px; border: 2px solid black; border-radius: 7px; background-color: black; color: white; display: flex; align-items: center; justify-content: center; z-index: 5; position: relative; top: 163px; left: 129px; font-family: "Roboto", "Arial", sans-serif; font-weight: 500; } .boxtitle { height: 49px; width: 702px; /* border: 2px solid gray; */ display: flex; align-items: center; justify-content: left; color: white; bottom: 12px; position: relative; text-overflow: ellipsis; line-height: 2.2rem; max-height: 4.4rem; font-size: 1.6rem; font-weight: 500; font-family: "Roboto", "Arial", sans-serif; } .boxdescription { height: 99px; width: 702px; /* border: 2px solid grey; */ display: flex; align-items: center; justify-content: left; color: rgb(152, 147, 147); position: relative; top: 3px; } .innerbox { display: flex; align-items: center; justify-content: center; font-weight: 500; font-family: "Roboto", "Arial", sans-serif; } .innerboxdot { font-weight: 400; display: flex; align-items: center; justify-content: center; position: relative; bottom: 3px; font-family: "Roboto", "Arial", sans-serif; } </style> </head> <body> <div class="container"> <div class="photo box"> <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRj_nNfaS6PjY5sGzdvEyn4wrFFrrPl_WSoLQ&usqp=CAU" height="190px" width="180px" id="img" /> <div class="numberbox">Video Time</div> </div> <div class="textbox box"> <div class="boxtitle">Title Here</div> <div class="boxdescription"> <div class="innerbox">Channel Name</div> <div class="innerboxdot">.</div> <div class="innerbox">views</div> <div class="innerboxdot">.</div> <div class="innerbox">upload time</div> </div> </div> </div> <script> console.log("Running Script"); let photo=document.body.children[0].children[0].children[0] let video_time=document.body.children[0].children[0].children[1].innerText let title=document.body.children[0].lastElementChild.children[0].innerText let channel_name=document.body.children[0].children[1].lastElementChild.children[0].innerText let views=document.body.children[0].children[1].lastElementChild.children[2].innerText let upload_time=document.body.children[0].children[1].lastElementChild.children[4].innerText console.log("Running Photo"); let user_photo=prompt("Enter The URL Of Image You Want As Thumbnail : \n(If Not Type \"no\")") if (user_photo=="no" || user_photo=="No" || user_photo=="NO") { document.body.children[0].children[0].children[0].setAttribute("src","https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRj_nNfaS6PjY5sGzdvEyn4wrFFrrPl_WSoLQ&usqp=CAU") } else{ document.body.children[0].children[0].children[0].setAttribute("src",user_photo) } console.log(user_photo); console.log("Running Video Timing"); let user_video_time=prompt("Enter Your Video Timing : \n(Type In The Format hour:minute:second or minute:second") video_time=user_video_time console.log(user_video_time, typeof user_video_time); console.log("Running Title"); let user_title=prompt("Enter Title OF Your Video : ") title=user_title console.log(user_title); console.log("Running Channel Name"); let user_channel_name=prompt("Enter Your Channel Name : ") channel_name=user_channel_name console.log(user_channel_name); console.log("Running Views"); // let user_views=prompt("Enter Views :\n(Enter In Pure Number)") // if (user_views.length=4 || user_views.length=5 || user_views.length=6) { // views=String(Math.ceil.((Number)user_views/1000))+"K views "; // } // else if (user_views.length=7 || user_views.length=8 || user_views.length=9) { // views=String(Math.ceil.((Number)user_views/1000000))+"M views " // } // else if (user_views.length=10 || user_views.length=11 || user_views.length=12) { // views=String(Math.ceil.((Number)user_views/1000000000))+"B views " // } // else{ // views=user_views // } // console.log(user_views); console.log("Running Upload Time"); let user_upload_time=prompt("Enter Upload Time : \n(Enter In The Format {Number Month} Or {Number Year})") upload_time=user_upload_time+" ago " console.log(user_upload_time); console.log("End"); </script> </body> </html> 我为自定义 YouTube 卡制作了此代码。所有 console.log 函数都在运行,但输入并未像这样添加 video_time=user_video_time。另请修复评论中的代码(它显示错误,我不知道为什么)。要运行此代码,请将给定代码保存为 html 文件。 我尝试使用 querySelector() 更改代码,但没有成功。如果单独输入,所有代码都可以在浏览器控制台中运行。 我为自定义 YouTube 卡制作了此代码。所有 console.log 函数都在运行,但输入并未像这样添加 video_time=user_video_time。另请修复评论中的代码(它显示错误,我不知道为什么)。要运行此代码,请将给定代码保存为 html 文件。 我尝试使用 querySelector() 更改代码,但没有成功。如果单独输入,所有代码都可以在浏览器控制台中运行。 在脚本标签中,当需要更改 HTML 标签时,获取完整的元素(标签)。但这里的“title”或“channel_name”变量,您正在获取标签内的数据。 所以, title =“此处的标题”最初。 现在,您只需将提示数据分配给该“标题”变量即可。但实际上你需要获取整个标签。 例如: let title = document.body.children[0].lastElementChild.children[0] 现在,使用 将提示值分配给标题 title.innerText = user_title

回答 1 投票 0

如何使用 Renderer2 设置 Angular 中原生元素的值?

我想设置nativeElement的innerText/innerHTML/textContent? this.render.setValue(this.nativeCloneLi.querySelector('.down .inn'), timeVal); 其中 timeVal 是一个字符串 该元素是

回答 2 投票 0

对于 XPATH,如何对不同类型的祖先使用 OR?

我试图阻止某些结果出现在我的 Google 搜索中,但我很难使用 uBlock Origin 简洁地创建单行块。 例如,我不想要“www”。伊米丰....

回答 1 投票 0

JavaScript 图像替换

我想知道是否有一种简单的方法可以让脚本循环遍历网页上的所有图像(可能属于某个类别)并将所有这些图像的来源更改为同一图像。这是为了

回答 3 投票 0

如何在React中使用类列表?

我试图在页面大小调整时将导航栏从桌面视图更改为移动视图。现在我已将导航栏代码设置为 2 个不同的组件,其中一个是桌面 vi...

回答 1 投票 0

如何委托事件将我的函数应用到使用普通 Java 脚本动态创建的卡片?

我正在尝试应用一项功能,在单击时隐藏或显示动态创建的卡片的背面(反之亦然)。第一个函数有效,但它只适用于模板,所以我发现......

回答 1 投票 0

通过 JSInterop 调用 DOM 元素上的方法

如何在 jsinterop (InvokeVoidAsync) 调用中调用给定 ElementReference (Blazor) 参数的 (DOM) 元素的 Javascript 方法? 我想我可以为该元素分配一个 id 属性,然后...

回答 1 投票 0

我正在尝试委托事件(“单击”)以将我的函数应用到使用普通 Java 脚本动态创建的卡片

我正在尝试应用一项功能,在单击时隐藏或显示动态创建的卡片的背面(反之亦然)。第一个函数有效,但它只适用于模板,所以我发现......

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.