相关疑难解决方法(0)

我正在尝试获取范围对象中的所有DOM节点,这样做的最佳方法是什么？

var selection = window.getSelection(); //what the user has selected
var range = selection.getRangeAt(0); //the first range of the selection
var startNode = range.startContainer;
var endNode = range.endContainer;
var allNodes = /*insert magic*/;

我一直在考虑过去几个小时的方法,并想出了这个:

var getNextNode = function(node, skipChildren){
    //if there are child nodes and we didn't come from a child node
    if (node.firstChild && !skipChildren) {
        return node.firstChild;
    }
    if (!node.parentNode){
        return null;
    }
    return node.nextSibling 
        || getNextNode(node.parentNode, true);
};

var getNodesInRange = function(range){
    var startNode = range.startContainer.childNodes[range.startOffset]
            || …

在javascript中实现富文本编辑器时,我需要对所选范围内的每个文本节点应用一些更改.Range对象提供接口获取startContainer,endContainer,startOffset,endOffset选定范围.如何迭代中间的每个DOM节点？

var selection = window.getSelection();
var range = selection.getRange(0);
// How can I iterate over every node within the range?

我需要找到给定节点中的所有块元素.块元素不仅仅是display:blockCSS中的元素,还有像div和的默认块元素p.

我知道我可以获得元素的计算样式并检查display属性,但是,我的代码将在一个长循环中执行并且每次都获得计算样式刷新reflow堆栈,因此它将非常广泛.

我正在寻找一些没有做到这一点的技巧getComputedStyle.

编辑

这是我想要改进的当前代码:

var isBlockOrLineBreak = function(node)
{
    if (!node) {
        return false;
    }
    var nodeType = node.nodeType;
    return nodeType == 1 && (!inlineDisplayRegex.test(getComputedStyleProperty(node, "display")) || node.tagName === "BR")
        || nodeType == 9 || nodeType == 11;
};

另一个编辑

jQuery的.css调用了getComputedStyle.所以这不是我想要的.

我的解决方案

谢谢大家的建议.不幸的是,它们都不符合我的要求.经过大量的文档挖掘后,我意识到如果没有getComputedStyle,没有真正的方法可以做到这一点.但是,我想出的代码应尽可能避免getComputedStyle.这是代码:

$.extend($.expr[':'], {
    block: function(a) {
        var tagNames = {
            "ADDRESS": true,"BLOCKQUOTE": true,"CENTER": true,"DIR": true,"DIV": true,
            "DL": true,"FIELDSET": true,"FORM": true,"H1": true,"H2": true,"H3": true,
            "H4": true,"H5": true,"H6": true,"HR": …