[H5]range对象的setStart/setEnd方法
1.setStart:表示某个节点的range对象的起点位置;
2.setEnd:表示某个节点的range对象的结束位置;
示例如下:
<body>
<div id="div">
这里是第一段文字
</div>
<input type="butt on" onclick="dele()" value="删除">
<script>
function dele() {
var div=document.getElementById("div");
var range=document.createRange();
var content=div.firstChild;
range.setStart(content,1);
range.setEnd(content,7);
range.deleteContents();
}
</script>
</body>
3.setStartBefore:表示用于将某个节点的起点位置设置为range对象的起点位置;
4.setStartAfter:表示用于将某个节点的终点位置设置为range对象的起点位置;
5.setEndBefore:表示用于将某个节点的起点位置设置为range对象的终点位置;
6.setEndAfter:表示用于将某个节点的终点位置设置为range对象的终点位置;
示例如下:
<body>
<table id="table" border="1" cellspacing="0" cellpadding="0">
<tr>
<td>表格1</td>
<td>表格1</td>
<td>表格1</td>
</tr>
<tr>
<td>表格2</td>
<td>表格2</td>
<td>表格2</td>
</tr>
<tr>
<td>表格3</td>
<td>表格3</td>
<td>表格3</td>
</tr>
</table>
<input type="button" onclick="btn()" value="删除第一行">
<script>
function btn() {
var table=document.getElementById("table");
var rangeDiv=document.createRange();
if(table.rows.length>0){
var row=table.rows[0];
rangeDiv.setStartBefore(row);
rangeDiv.setEndAfter(row);
rangeDiv.deleteContents();
} }
</script>
[H5]range对象的setStart/setEnd方法的更多相关文章
- [H5]range对象之selectNode等方法
关于range对象的selectNodeContents.selectNode.deleteContents方法 示例代码如下: <!DOCTYPE html> <html lang ...
- [H5]range对象的createRange方法
range对象的extractContents()方法: extractContents() 方法删除文档内容,并以 DocumentFragment 对象的形式返回它; DocumentFragme ...
- [H5]range对象的clone方法
clone:range对象的克隆; <body> <p id="p">这是一段文字</p> <button onclick="b ...
- html5学习笔记4--API Range对象(一)
Range对象基本用法 效果图如下(在谷歌浏览器下的展示)
- HTML5中的Range对象的研究
一:Range对象的概念 Range对象代表页面上的一段连续区域,通过Range对象,可以获取或修改页面上的任何区域,可以通过如下创建一个空的Range对象,如下: var range = docu ...
- HTML5 编辑 API 之 Range 对象(一)
一.Range 对象基本概念 通过使用 Range 对象所提供的方法实现一个鼠标选取内容,通过点击按钮打印出选中内容,当然注意在不同的浏览器下可选中的内容数量是不同的. <!DOCTYPE h ...
- HTML5中的Range对象的研究(转载)
一:Range对象的概念 Range对象代表页面上的一段连续区域,通过Range对象,可以获取或修改页面上的任何区域,可以通过如下创建一个空的Range对象,如下: var range = docu ...
- XML DOM - Range 对象
Range对象 Range对象表示文档的连续范围区域,如用户在浏览器窗口中用鼠标拖动选中的区域. dom标准Range对象 在IE中使用TextRange对象 range对象常用的建立方法在开发中 ...
- web前端学习(二)html学习笔记部分(3)--range对象
1.2.8 html5编辑api之range对象(一) 1.2.8.1 Range 对象基本概念 Range 对象的基本概念,通过使用 Range 对象所提供的方法实现一个鼠标选取内容,通过点击按 ...
随机推荐
- Ajax获取数据的几种格式和解析方式
一.什么是ajax AJAX的全称是Asynchronous JavaScript and XML(是异步的 javascript 和 XML). ajax不是新的编程语言,而是一种使用现有标准的 ...
- Android系统--输入系统(十五)实战_使用GlobalKey一键启动程序
Android系统--输入系统(十五)实战_使用GlobalKey一键启动程序 1. 一键启动的过程 1.1 对于global key, 系统会根据global_keys.xml发送消息给某个组件 & ...
- SSH连不上虚拟机的问题解决
这几天工作任务不重,今早上班打算在liunx下运行下python脚本.打开VM,SSH突然连不上虚拟机了.网上试了很多方法都不行,最后花费2个小时解决了这一问题. 结合我的实际情况,问题解决如下: 1 ...
- Hadoop集群的hbase介绍、搭建、环境、安装
1.hbase的介绍(自行百度hbase,比我总结的全面具体) HBase – Hadoop Database,是一个高可靠性.高性能.面向列.可伸缩的分布式存储系统,利用HBase技术可在廉价PC ...
- java窗口按钮位置设置
java窗口按钮位置设置 代码如下: package Day08; import java.awt.BorderLayout; import javax.swing.JButton;import ja ...
- [vijos 1642]班长的任务 [树形dp]
背景 十八居士的毕业典礼(1) 描述 福州时代中学2009届十班同学毕业了,于是班长PRT开始筹办毕业晚会,但是由于条件有限,可能每个同学不能都去,但每个人都有一个权值,PRT希望来的同学们的权值总和 ...
- 老生常谈之SQL Server (行转列,列转行)
Open the first article 在本文章中主要介绍以下内容: 1.静态行转列 2.静态列转行 3.动态行转列 4.动态列转行 1.静态行转列 --静态的行转列 --新建一个科目成绩表 - ...
- MATLAB的神经网络工具箱介绍
一.使用matlab2010b以后的版本会有完整的神经网络工具箱,使用nnstart可以调出toolbox,然后选择需要的功能,导入数据,选择训练参数和每层神经元个数,最后训练会输出网络与结果. 二. ...
- Vue组件基础用法
前面的话 组件(Component)是Vue.js最强大的功能之一.组件可以扩展HTML元素,封装可重用的代码.根据项目需求,抽象出一些组件,每个组件里包含了展现.功能和样式.每个页面,根据自己所需, ...
- Java中synchronized和Lock的区别
synchronized和Lock的区别synchronize锁对象可以是任意对象,由于监视器方法必须要拥有锁对象那么任意对象都可以调用的方法所以将其抽取到Object类中去定义监视器方法这样锁对象和 ...