Tag: dom

jQuery在特定元素之后获取DOM中的下一个匹配项

我讨厌承认它，但我一直试图弄清楚如何做到这一点。 例如假装你有以下结构： https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/… https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/… 我在一个与上面突出显示的 “foo”节点相关的jQuery事件处理程序中。 我想找到“下一个” img元素，它是一个”foo” 。 但是有2个问题。 我只想选择DOM中比我当前节点更远的“foo”元素（例如“之前的”foo，并且不需要当前的foo） 虽然我已经将嵌套显示为精确模式，但生成的代码可以嵌套在任何级别https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/…https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/…因此我不能只做.parent（）。parent（）。parent（）。siblings（ ）.find（）https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/…https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/…等 如果你可以想象每次浏览器向DOM添加一个节点时，它会递增一个计数器，并为索引分配https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/…你可以检索https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/…我想要的是： var here = $(this).getIndexInDOM();//eg returns 347 $(‘img.foo’).each(function(){ if($(this).getIndexInDOM() > here){//is this past our current index? doSomething($(this));//use it break; } }); .getIndexInDOM()方法显然在jQuery中不存在https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/…但我很好奇是否有人有解决方案来获取我所追求的“下一个”元素。 我现在能想到的唯一解决方案是非常优雅的，并且在DOM的后半部分中会表现得非常糟糕https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/…https://stackoverflow.com/questions/3702094/jquery-to-get-next-match-in-the-dom-after-a-particular-element/… //using vanilla JavaScript var thisImg = theCurrentImageIHave;//some reference to the DOM element var found = false; for(var i=0;i<document.images.length;i++){ if(found){ […]

在DOM元素上创建角度范围

我需要创建一个新的角度范围并将其附加到DOM元素。 我正在修改第三方控件，所以我没有选择只使用指令。 我需要做一些事情： … = thirdPartyCallbackfunction(domElement){ var myNewScope = $scope.$new(true); myNewScope.title = ‘Hello’; domElement.scope = myNewScope; //??? } 此外，我尝试手动将ng-scope添加到DOM元素，但ng-inspector向我显示它没有创建新的子范围。 $(domElement).scope(); 尝试时给我根本范围。 文档也不是很有帮助。

在动态创建的元素上附加javascript / jquery事件

我已经看到了许多与此类似的不同问题，但所有这些问题通常都针对特定的选择器。 如果某处有重复，请告诉我，我已经错过了。 采取这种情况： 你想为wordpress，drupal或任何使用第三方function的网站构建一个jquery插件。 由于您事先并不知道每个特定事件和选择器，因此您需要定位如何将jquery / javascriptfunction添加到动态创建的元素中。 另外，你不知道元素是如何创建的（使用ajax / php / etc进行回调）。 例： 我最近尝试将select2或selectize添加到我的整个网站。 不幸的是，由于我无法提前确定将添加选择元素（来自其他插件/模块），我无法确保select jquery将适用于新创建的选择。 选择二 这是常规方法，但不适用于动态创建或克隆的选择： jQuery(document).ready(function($) { $(“select”).select2(); }); 如果我知道添加这些选择的所有事件，我可以简单地执行以下操作： $( “.some_button_that_creates_new_selects” ).on( “click”, function() { jQuery(“select”).select2(); }); }); 但是，由于我不知道所有动态选择的选择器（因为许多是由第三方插件添加的），所以select2将不适用于新的选择。 所以上面只适用于每个案例senerio。 我需要找到一种遍历dom树的方法，并识别何时创建新选择。 我尝试使用.on定位几个事件，但它根本不能正常工作。 我读到javascript document.getElementsByTagName识别dom中的更改并反映在集合中。 我也查看了querySelectorAll ，但不确定它是如何工作的。 我也尝试搞乱MutationObserver并检查select标签的.addednodes.length是否发生了变化，但我并没有真正得到任何结果。 UPDATE 在做了一些测试后，我意识到问题可能在于select2插件本身。 Select2加载动态选择，但没有获得定位。 Chrome最终会抛出typeerros：无法读取属性’find’的null，无法读取null的’hasclass’属性。

使用jQuery解析无效的HTML，而不添加到DOM？

我正在研究一个使用HTML模板的jQuery插件。 最终用户可以传入一个模板，该模板查看最简单的级别，如下所示： 该模板应该被注释掉，以便浏览器不会尝试渲染任何东西，我的代码只是将注释的内部提取为文本，然后使用jQuery将其解析为元素树。 然后我做了具体的替换。 我记得读过jQuery只是使用DOM来解析HTML，例如当你这样做时 var x = $(html_string); jQuery实际上只是将它添加到DOM来获取元素。 上面的简单操作不会呈现任何内容（直到我实际在DOM中的某处添加了x ），但是这段代码导致浏览器尝试加载图像目标 – 即使我从未将它添加到DOM中。 以下是此效果的简单演示： http ： //jsfiddle.net/b5HGU/ 所以基本上 – 有什么方法可以解决这个问题吗？ 你可以使用jQuery创建一个带有已知坏src标记的“image”元素，但是在你真正将它添加到真正的DOM之前不要加载它吗？ 另一个替代方法是在使用jQuery构造DOM 之前 ， 在模板上完成所有解析，作为字符串。 这当然是可行的，但实际上模板有许多不同的组件，在输出解析版本之前使用jQuery选择器将其转换为可导航树非常方便。 我必须基本上编写自己的XML解析器。 在我这么做之前，只是想知道是否有任何简单的解决方案。

使用JQuery event.target与孩子们一起工作

我的问题专门针对http://api.jquery.com/event.target/#example-1 如果您使用 或其他标记中的span来更改这样的样式，就像我在这里所做的那样，元素的那一部分将不会触发JQuery函数来切换它的子节点。 怎么可能让这个工作？ HTML： This doesn’t work, this does sub item 1-a sub item 1-b item 2 sub item 2-a sub item 2-b JavaScript的： function handler(event) { var $target = $(event.target); if( $target.is(“li”) ) { $target.children(“ul”).toggle(); } } $(“ul”).click(handler).find(“ul”).hide();

插入元素的父元素之后

在下面的示例中，为了在test3类的父（divouter）之后插入，我需要什么样的选择器？ 谢谢。

在removeClass之后仍然触发JQuery类选择器

我正在创建一个小型投票机制，通过AJAX发送快速数据库时间戳。 一系列具有“投票”类别的按钮是投票的触发器，而下面的文本显示该特定项目有多少“投票”。 从click事件运行AJAX方法后，我删除了“vote”类，使得该项不能有多个。 但是我的问题是，即使删除了类，触发器仍然可以触发并增加投票数。 这是元素的HTML： ‘.$points.’ Points 这是jQuery调用： $(‘.vote’).click(function(){ var iID = $(this).attr(‘alt’); var typeString = “id=”+iID; $.ajax({ type: “POST”, url:”vote.php”, data: typeString, success: function (txt){ $(‘.vote-‘+iID).html(”+txt+’ Points’); } }); $(this).attr(‘src’, ‘images/voted.gif’); $(this).removeClass(‘vote’); });

Jquery在iframe中检测body标签上的更改或keyup

我的页面上有一个jwysiwyg内容编辑器控件。 该控件的工作原理是在iframe中创建自己的iframe，其中包含完整的html页面代码。 我希望检测是否有change或keyup以便我可以使用“指示记录需要保存”代码。 我们有输入框，这项工作很好，只是这个第三方编辑器控件给我们带来了问题。 以下是页面源的外观： I just typed this now! 看到body标签包含实时更改。 有了这些SO问题…… jQuery’if .change（）或.keyup（）’ https://stackoverflow.com/a/1639342/511438 我在文档中尝试了以下内容。准备： $(‘iframe’).contents().find(‘body.wysiwyg’).live(‘change’, function (e) { alert(‘testing’); }); $(‘iframe’).contents().find(‘body.wysiwyg’).live(‘keyup’, function (e) { alert(‘testing’); }); $(‘iframe > *’).bind(‘keyup’, function (e) { alert(‘testing’); }); 希望这个版画屏幕有用。 LARGER

如何检索JQuery数据表的排序状态

我是JQuery Datatables的新手， 我正在尝试检索有关Datatable的两个信息 当前正在对哪个列索引进行排序（也称为已选择） 它正在排序的顺序（asc或desc） 不确定我应该如何处理这个问题（使用jquery查找列索引或者Datatables有一个允许我检索此信息的API。 非常感谢：D

如何查找哪个脚本修改所选属性的css

有没有办法获取哪些脚本修改了所选DOM元素的信息，以及以哪种顺序？ 在我的网站上，我修改了div A的宽度。然而，看起来，其他一些脚本修改了那个宽度，但我不知道它是哪个脚本。 我该怎么找到它？ 编辑：搜索了一下之后，我想知道在firebug中你可以在HTML视图中右键单击属性，然后选择“在更改时停止javascript”（或者类似，我的firefox不是英文版），问题是重新加载后重置页面，是什么使它成为我的用途。