document.selection.createRange() 根据当前文字选择返回 TextRange 对象,或根据控件选择返回 ControlRange 对象。

配合 execCommand,在 HTML 编辑器中很有用,比如:文字加粗、斜体、复制、粘贴、创建超链接等。

实例一:

<textarea cols=50 rows=15>
哈哈。我们都是新生来得。大家都来相互帮助呀。这样我们才能进步,我们才能赚大钱!</textarea>
  <input type=button value=选择字后点击我看看 οnclick=alert(document.selection.createRange().text)>
</form>

实例二:

<body> 
    <textarea name="textfield" cols="50" rows="6">就是现在文本域里有一段文字,当你选种其中几个字后点击一个按钮或者链接会弹出一个对话框,对话框的信息就是你选中的文字
哪位老大能解决的呀?请多多帮忙!!!谢谢
</textarea> 
    <input type="button" value="showSelection" οnclick="alert(document.selection.createRange().text)">
    <input type="button" value="showclear" οnclick="alert(document.selection.clear().text)">
    <input type="button" value="showtype" οnclick="alert(document.selection.type)"> 
    <textarea name="textfield" cols="50" rows="6" οnselect="alert(document.selection.createRange().text)">就是现在文本域里有一段文字,当你选种其中几个字后点击一个按钮或者链接会弹出一个对话框,对话框的信息就是你选中的文字
哪位老大能解决的呀?请多多帮忙!!!谢谢
    </textarea>

</body>

实例三:选中Input中的文本

<SCRIPT   LANGUAGE="JavaScript">  
  <!--  
  function   test2()  
  {
  var   t=document.getElementById("test")
  var   o=t.createTextRange()
  alert(o.text)  
  o.moveStart("character",2)  
  alert(o.text)  
  o.select()  
  }  
  //-->  
  </SCRIPT>  
  <input   type='text'   id='test'   name='test'><input   type=button   οnclick='test2()'   value='test'   name='test3'>
对textarea中的内容,进行选中后,加效果
<script language="JavaScript">
<!--
function bold(){
Qr=document.selection.createRange().text;
if(!Qr || document.selection.createRange().parentElement().name!='description')
{
txt=prompt('Text to be made BOLD.','');
if(txt!=null && txt!='') document.form1.description.value+=''+txt+'';
}
else{
document.selection.createRange().text=''+document.selection.createRange().text+'';
document.selection.empty();
}
}
//-->
</script>
<input type="button" value="加粗" οnclick="bold();" />
<textarea name="description" style="width: 436px; height: 296px">选中我,点击加粗</textarea>
    实例四:javascript捕获到选中的网页中的纯文本内容
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>鼠标取词</title>
<script>
function getSel()
{
      var t=window.getSelection?window.getSelection():(document.getSelection?document.getSelection():(document.selection?document.selection.createRange().text:""))
      document.forms[0].selectedtext.value = t;
}
</script></head>
<body οnmοuseup="getSel()">
<form>
<textarea name="selectedtext" rows="5" cols="50"></textarea>
</form>
以上的代码可以捕获到选中的网页中的纯文本内容(不含HTML标签)
如果想获得包含html的内容,将document.selection.createRange().text改成document.selection.createRange().htmlText
</body>
</html>

document.selection.createRange方法相关推荐

  1. DHTML之-----document.selection 的 createRange

    一.document.selection 介绍 document.selection 表示当前网页中的选中内容. 方法有: clear 清除选中的内容 empty 取消选中 createRange 返 ...

  2. JS的Document属性和方法

    document.title //设置文档标题等价于HTML的title标签 document.bgColor //设置页面背景色 document.fgColor //设置前景色(文本颜色) doc ...

  3. 关于document.selection和TextRange对象的介绍

    document.selection只有IE支持 window.getSelection()也只有FireFox和Safari支持,都不是标准语法. selection 对象代表了当前激活选中区,即高 ...

  4. document.selection

    简介 selection是对当前激活选中区(即高亮文本)进行操作. 在非IE浏览器(Firefox.Safari.Chrome.Opera)下可以使用window.getSelection()获得se ...

  5. document的createElement方法创建具有指定标签的DOM对象

    可以使用document的createElement方法创建具有指定标签的DOM对象,然后通过调用元素的appentChild的方法将新创建的元素添加到相对应的元素下 <script type= ...

  6. ie8不兼容java项目_[Java教程]ie8以下不兼容document.getElementsByName解决方法

    [Java教程]ie8以下不兼容document.getElementsByName解决方法 0 2016-09-13 19:00:06 在IE8以认为只有文本标签才有name属性的,一些元素标签用d ...

  7. docx_demos(创建文档类Document及属性方法, 创建段落文本类Paragraph及段落格式设置, 创建字体设置类Run及属性等)

    """ docx_demos.py(创建文档类Document及属性方法, 创建段落文本类Paragraph及段落格式设置, 创建字体设置类Run及属性等)使用:一.创建 ...

  8. JavaScript核心之Document对象详解(document属性,方法)

    目录 1 Document节点概述 2 document节点的属性 2.1 doctype,documentElement,defaultView,body,head,activeElement 2. ...

  9. IE、FireFox、Opera三种浏览器Document对象的方法对比

    IE FF Opera activeElement activeElement activeElement addBinding addEventListener adoptNode adoptNod ...

最新文章

  1. Dicom 学习笔记-Dicom 消息服务(DIMSE-C/DIMSE-N)
  2. R有序因子和无序因子(4)
  3. 基于visual c++之windows核心编程代码分析(31)SNMP协议编程
  4. springboot学习笔记(九)
  5. Google-glog 日志库使用手记
  6. android studio clone 方法不能先用,Android Studio中使用git功能无法clone原因分析
  7. bzoj 1028: [JSOI2007]麻将
  8. 一张倾斜图片进行矫正 c++_专业性文章:10分钟矫正骨盆前倾
  9. 【Python】Matplotlib绘制可爱机器人
  10. 《2022产业互联网安全十大趋势》正式发布
  11. mysql 主命令总结
  12. 关于安卓图片剪切造成软件崩溃问题的解决方法
  13. 网易云信周梁伟专访:亿级架构IM平台的技术难点解析
  14. UVa 10019 - Funny Encryption Method
  15. 工业界推荐_Industrial RS(4)
  16. 网安之php开发第十七天
  17. 2019性价比旗舰手机哪家强?联想Z6 Pro当仁不让
  18. 数字人民币APP更新后 打不开/闪退 的解决方法
  19. 用jdk1.8还是用jdk11
  20. 查看keystore签名文件的MD5值

热门文章

  1. 中石油A股申购中签号码公布
  2. 400万瓶酒庄酒上链,腾讯安全领御与张裕共建区块链溯源平台
  3. for i in enumerate(): 解析
  4. Typora软件下载
  5. android圆形头像边框,Android Studio实现带边框的圆形头像
  6. 小白学jquery Mobile《构建跨平台APP:jQuery Mobile移动应用实战》连载结束
  7. JS十六进制颜色(#fff)与RGB, HSL颜色的相互转换 (实用、赞)
  8. macbookpro m1 docker安装mysql主从
  9. 5-1 厘米换算英尺英寸
  10. 为嘛子要慎用mysql的enum字段?(来自向东的原创博客)