HTML5 页面编辑API之Range对象二

本文深入解析JavaScript中Range对象的使用方法,包括克隆、选择内容、插入节点、比较边界点等核心功能,并通过实例演示如何在实际项目中灵活运用这些方法进行DOM操作。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Range对象方法

克隆:

var r = document.createRange();

r.selectNodeContents(node);

var clone = r.cloneRange();//克隆Range对象

var str = clone.toString();



var contents = r.conleContents();//克隆内容

div.appendChild(contents);



r.extractContents();//移除当前节点的内容并返回内容

r.insertNode(node);//将一个node插入到选择的Range起始位置


r.compareBoundaryPoints(Range.START_TO_END, range2);//判断r与range2的相对位置,Range.START_TO_END在range2前返回true,否则false

反之 Range.END_TO_START在range2后返回true,否则false


r.collapse(false);//此方法传入false取消选择的内容

r.detach();//释放range对象

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值