Сравнивая граничные точки между диапазонами

Question

Я не знаю, правильно ли заголовок. Дело в том, что я нашел фрагмент, чтобы получить позицию курсора, когда он сосредоточен в контентном элементе. Я понимаю весь код, но есть пять строк, которые я не знаю, для чего они хороши.

Хорошо. Эти строки являются функцией, которая передается в Treewalker в качестве параметра. И они касаются сравнения граничных точек, но, как и для чего ?. Я исследовал много дней и еще не нашел функциональность ists.

function(node) { 
     var nodeRange = document.createRange(); 
     nodeRange.selectNode(node); 
     return nodeRange.compareBoundaryPoints(Range.END_TO_END, range) < 1 ? 
      NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT; 
    } 

Весь фрагмент кода это (просто, чтобы расположить его в контексте):

function getCharacterOffsetWithin(range, node) { 
var treeWalker = document.createTreeWalker(
    node, 
    NodeFilter.SHOW_TEXT, 
    function(node) { 
     var nodeRange = document.createRange(); 
     nodeRange.selectNode(node); 
     return nodeRange.compareBoundaryPoints(Range.END_TO_END, range) < 1 ? 
      NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT; 
    }, 
    false 
); 

var charCount = 0; 
while (treeWalker.nextNode()) { 
    charCount += treeWalker.currentNode.length; 
} 
if (range.startContainer.nodeType == 3) { 
    charCount += range.startOffset; 
} 
return charCount; 
} 

document.body.addEventListener("keyup", function() { 
    var el = document.getElementById("test"); 
    var range = window.getSelection().getRangeAt(0); 
    document.getElementById("position").innerHTML = "Caret char pos: " + getCharacterOffsetWithin(range, el); 
}, false); 

Это можно увидеть на работе здесь: JS Fiddle

Спасибо вам большое, я просто хочу Прежде чем работать с этим, поймите это. Извините, за длинную статью.

Answer 1

Это похоже на мой код, от this question. Это слишком сложно для задачи, которую она пытается выполнить, и я предоставил simpler alternative to a similar question, который я бы рекомендовал использовать вместо этого. Теперь я обновил исходный ответ со ссылкой на более простой ответ.

Что касается вашего вопроса о том, что делает эта функция, там есть фильтры для фильтрации узлов. TreeWalker посещает все текстовые узлы в узле контейнера и дает только узлы, которые расположены до конца выбора. Функция фильтра вызывается на каждый текстовый узел, создает диапазон, охватывающий текстовый узел, и проверяет, является ли конец текстового узла более ранним в документе, чем конец диапазона выбора, с использованием compareBoundaryPoints().