草庐IT

DOM-Level

全部标签

javascript - 使用 JavaScript 包装一组 DOM 元素

我的页面上有一系列p标签,我想将它们全部包装到一个容器中,例如foobarbaz我想把上面所有的标签都包装成一个容器,如下所示:foobarbaz如何使用原生JavaScript将NodeList包装在元素中? 最佳答案 下面发布的是jQuery的wrap和wrapAll方法的纯JavaScript版本。我不能保证它们的工作方式与在jQuery中一样完全,但实际上它们的工作方式非常相似,应该能够完成相同的任务。它们使用单​​个HTMLElement或它们的数组。我没有测试确认,但它们应该都适用于所有现代浏览器(在一定程度上也适用于旧

javascript - React react-router-dom 将 Prop 传递给组件

我需要使用路由器将Prop传递给组件。这是我的代码:importReact,{Component,PropTypes}from'react';import{connect}from'react-redux';importAppBarTopfrom'./appbar/AppBarTop';importLoginfrom'../pages/login/Login';import{BrowserRouterasRouter,Route}from'react-router-dom';classAppextendsComponent{render(){const{isAuthenticated}

javascript - "Cut and Paste"- 使用 Javascript 在 DOM 中移动节点

我有大致如下所示的html代码:somehtmlmaybesomemoredifferenttextheremaybeevenaformitem显然还有更多的东西,但这是基本的想法。我需要做的是交换#id2和#id3的位置,所以结果是:......有谁知道可以读写两个节点(及其所有子节点)以便交换它们在DOM中的位置的函数(我敢肯定我不是第一个需要此功能的人)? 最佳答案 在这种情况下,document.getElementById('id1').appendChild(document.getElementById('id2'))

javascript - 如何在 JSDoc 中将参数标记为包含 DOM 节点?

我想指出一个参数应该是一个DOM节点,但我似乎无法找到任何关于如何使用JSDoc来表明这一点的信息。我可以只使用{Object},但这相当丑陋。我更愿意使用{Node}或{DOMNode}之类的东西,但我找不到任何示例来指向那个方向。那么,如何将参数标记为需要DOM节点? 最佳答案 来自jsdoc.app对于@type注释:AtypeexpressioncanincludetheJSDocnamepathtoasymbol(forexample,myNamespace.MyClass);abuilt-inJavaScripttype

javascript - 在将用户输入添加到 Javascript 中的 DOM 之前清理用户输入

我在空闲时间为聊天应用程序编写JS,我需要根据用户提交的数据更改HTML标识符。这通常在概念上不够稳固,我什至不会尝试,但我认为这次我自己没有太多选择。然后我需要做的是转义HTMLid以确保它不会允许XSS或破坏HTML。代码如下:varuser_id=escape(id)vartxt=''+''+''+'To:'+''+''+'';转义id以避免上述任何类型问题的最佳方法是什么?如您所见,我现在正在使用内置的escape()函数,但我不确定与其他替代方案相比它应该有多好。我主要习惯于在输入进入文本节点之前对其进行清理,而不是id本身。 最佳答案

javascript - Backbone View 中的 tagName、id 和 className 属性有什么用?虽然我们可以使用 el 访问 dom 元素

为什么tagName、id和className属性存在于主干View中? 最佳答案 如果您的View必须创建自己的元素,即如果它在实例化时没有el属性,则使用这些属性(各种原因,我可以在这件事上走得更远).因此,您将拥有一个具有IDid、类className和属性attributes的新元素。您可以找到relevantpieceofcodehere.此_ensureElement方法在View的构造函数中使用。 关于javascript-BackboneView中的tagName、id和

javascript - 如何检查对象是否是 DOM 元素?

这个问题在这里已经有了答案:HowdoyoucheckifaJavaScriptObjectisaDOMObject?(36个答案)关闭2年前。我有一个函数:functionCheck(o){alert(/*oisaDOMelement?"true":"false"*/);}如何检查参数o是否为DOM对象?

Javascript/DOM 事件名称约定

当我开始做web开发时,我意识到Javascript事件名称都是小写的,没有分隔符,即"mousedown"、"mouseup"等。并且在使用jQueryUI库时,我注意到它们也使用相同的约定;即“dropdeactivate”,如下例所示$(".selector").on("dropdeactivate",function(event,ui){})虽然这对于只有2或3个单词的名字很有效,但对于包含更多单词的名字来说真的很糟糕。尽管如此,当我必须触发我创建的自定义(合成)事件时,我也遵循了该约定,直到最近我决定最好开始使用某种形式的分隔符。现在我使用类似"drop:deactivate

javascript - 我知道在 DOM 中存储数据不好,但为什么呢?

我一遍又一遍地听说“将DOM用作数据库”是一种不好的做法。虽然我基本同意这种观点,但这个问题更多地是关于非黑即白的案例。请记住对jQuery的.data()方法和HTML5数据属性规范的最新修订,为了方便而将一些数据粘贴到DOM中真的很糟糕吗?例如,我最近通过执行以下操作在充满输入的表上实现了“实时”计算功能:jQuery:$('table').bind('calculate',function(){vartotal=0;$(this).find('tr').each(function(){total+=$(this).data('value');});//displaytotal})

javascript - react-router-dom v4 中的多个嵌套路由

我在react-router-dom中需要多个嵌套路由我正在使用react-router-domv4我有我的import{BrowserRouterasRouter,Route}from'react-router-dom';我需要像这样渲染组件---Login---Home---Page1---Page2---Page3---About---etcHome组件包含一个Header组件,它对Page1、Page2和Page3组件是通用的,但在Login和About中不存在。我的js代码是这样写的我希望登录组件仅在/login上显示当我请求/page1、/page2、/page3时,它们应