开发者

Applying CSS across multiple TextNodes

开发者 https://www.devze.com 2023-03-05 05:49 出处:网络
I\'m looking for a way to apply a CSS class to an arbitrary text range in an HTML document. I\'m using MooTools and the the rangy library, and something like this works if there\'s only a single TextN

I'm looking for a way to apply a CSS class to an arbitrary text range in an HTML document. I'm using MooTools and the the rangy library, and something like this works if there's only a single TextNode to deal with:

createRange: function(start, end) {
    var node = this.textArea.childNodes[0]; // textArea is an HTML <span> element

    var range = rangy.createRange();
    range.setStart(node, start);
    range.setStart(node, end);

    return range;
}

This gives me a range I can then apply a CSS class to; However, if I have any HTML markup inside T开发者_开发百科extArea, I now have multiple TextNodes, and I need to set a range starting in one and ending in the other. I think I can do this if I can get an ordered list of all TextNodes inside textArea, but I'm not sure how (or if) I can get that list.


why not just style the ::select pseudo?

textarea::selection {
background: #abc;
color: #abc;
}

textarea::-moz-selection {
background: #abc;
color: #abc;
}

textarea::-webkit-selection {
background: #abc;
color: #abc;
}


Rangy has a CSS class applier module that I think will do what you want.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号