草庐IT

移除元素

全部标签

javascript - 在光标位置的可编辑 div 中插入几个元素

我有一个带有contenteditable属性的div。用户需要能够在光标所在的位置键入和插入多个选择菜单。我已经设法获取光标位置并插入第一个选择菜单,但它只适用于第一个文本节点。这就是我获取光标位置的方式:functiongetCaretCharacterOffsetWithin(element){varcaretOffset=0;vardoc=element.ownerDocument||element.document;varwin=doc.defaultView||doc.parentWindow;varsel;if(typeofwin.getSelection!="undef

javascript - Windows/IE11 中范围元素的 getBoundingClientRect 不正确

在IE11中使用范围对象获取BoundingClientRect时,它会报告错误的数字。它报告高度为128,而实际高度为74。它报告顶部偏移为8,而实际顶部偏移为35。这是一个已知错误吗?有没有办法在windowsie11中获得准确的选择数字。vardiv=document.querySelectorAll('div')[0];vart=div.childNodes[0];varrange=document.createRange();range.setStart(t,0)range.setEnd(t,1)console.log(range.getBoundingClientRect(

javascript - 如果指定了绝对位置和 overflow-x hidden,则无法滚动到元素

我有动画ng-view。我正在使用上滑动画,它需要元素的绝对位置以及overflow-x:hidden来剪辑内容。在一个子页面中,我必须使用scrollTo元素功能,但如果指定了both2个值,它就不起作用。这是正确动画所需的主要ng-view类.wrapper{position:absolute!important;left:0;top:0;height:100%;min-height:100%;min-width:100%;overflow-x:hidden;}和结构:Section1Section2Section3CCC我准备了plnkr轻松展示它现在的样子。除了这两个值,还有其

javascript - 获取已转换元素的局部坐标中的触摸位置

我有一个用matrix3d转换的元素给它透视。它代表手持设备的屏幕。有一个显示手持设备本身的背景图像,并且没有转换。放置它的元素被定位,屏幕元素绝对定位在它里面,在left:0;top:0;。,然后进行转换,原点位于容器的左上角。这是我将其与背景图像完美对齐的最简单方法(我使用thisveryhandytool得出矩阵),并将屏幕元素从Angular落移开。我希望能够通过鼠标和触摸事件与屏幕进行交互。为此,在单击或触摸事件时,我需要在屏幕元素的局部坐标系中找到坐标——即发生变换之前的坐标。换句话说,当单击手持设备屏幕的左上角(不是页面上边界框的左上角!)时,我想要[0,0],当单击屏幕

javascript - 查找以指定前缀开头的自定义元素

我有一堆以“food-cta-”开头的自定义元素。我正在JavaScript/jQuery中寻找一种能够选择这些元素的方法。这类似于我可以使用$('*[class^="food-cta-"]')的方式选择所有以food-cta-开头的类.是否可以搜索以“food-cta-”开头的元素?请注意,我会将此搜索注入(inject)页面,因此我无法访问Angular。自定义元素示例:编辑:我正在查看的代码如下所示:该应用程序使用AngularJS创建自定义元素,我认为这称为指令。 最佳答案 您可以使用XPath用表达式//*[starts-

javascript - 引用了一个元素,如何检测它何时附加到文档中?

我正在开发一个JavaScript模块,它对使用它的环境一无所知。而且,从技术上讲,我想实现下一个功能:onceAppended(element,callback);element是一个HTMLElement并且这个元素的父元素在模块初始化期间可能是未知的。callback是一个函数,当element出现在页面上时必须触发。如果元素附加到文档中,则必须立即调用回调。如果element尚未附加,函数将在element出现在文档中时触发callback。问题是,我们可以使用DOMNodeInserted变异事件来检测element追加事件。但是突变事件现在是deprecated.而且Mut

javascript - 如何在不使用 React 重新渲染整个列表的情况下添加新元素

我正在开发简单的流应用程序。我有帖子列表,这个列表可以接收更新,更新将显示在它的顶部。问题是在接收到每个新帖子时,React都会重新呈现整个元素列表。我已经为它做了一个简单的例子。有什么办法可以避免这种行为吗?我在React文档上看到了dynamic-children主题,但在示例中,如您所见,我已经更新了所有子项。classPostextendsReact.Component{render(){console.log('rerenderedpost',this.props.reactKey);return({this.props.post.text});}}classAppexten

javascript - 移除元素时 react 动画

我是React的新手。我正在尝试通过实现完整的CRUD来学习。但是,我无法让动画很好地从列表中删除类(class)。我已经在transitionAppear和transitionLeave上配置了动画。transitionAppear工作正常。我无法获取transitionLeave这是我的组件:https://github.com/leonardoanalista/react-crud/blob/master/src/components/course/CourseListRow.js这是动画的CSS:https://github.com/leonardoanalista/react

javascript - Angular:自动完成字段在删除元素后更改焦点

我有一个使用PrimeNG组件的Angular2应用。UI具有多选自动完成组件(p-autoComplete),类似于thedocumentation中的组件:唯一的区别是,在我的例子中,输入字段具有固定的尺寸和滚动条。问题:每次当我从自动完成列表的中间删除一个元素时,它会将焦点移动到输入字段的底部。它看起来像这样:这对用户来说非常烦人,尤其是当有几个字段应该被删除时。问题:如何在删除元素后强制滚动保持在同一位置?如何重现:更具体地说,您可以通过添加下一个css来重现该问题max-width:150px;max-height:100px;overflow-y:auto;直接在docum

javascript - 如何通过 Content-Security-Policy 允许 `javascript:void(0)` 在 HTML 元素属性中使用?

我希望能够做到或确保即使处理程序未能阻止默认操作也不会发生任何事情。我应该如何声明允许使用Content-Security-PolicyHTTP响应header而不求助于unsafe-eval? 最佳答案 我最近将CSP策略应用于一个巨大的VUE项目,方法是将元header添加到index.html。GoogleChrome会打印关于javascript:的警告链接,但除此之外没有其他任何事情发生。我所做的只是删除href="javascript:属性,并添加了一个样式来保持游标样式:a:hover{cursor:pointer;}