IE：document.selection 　　FireFox：window.getSelection() 　　document.selection只有IE支持，window.getSelection()也只有FireFox和   Safari支持，都不是标准语法。 
selection   对象  
   
  --------------------------------------------------------------------------------  
   
  代表了当前激活选中区，即高亮文本块，和/或文档中用户可执行某些操作的其它元素。  
  selection   对象的典型用途是作为用户的输入，以便识别正在对文档的哪一部分正在处理，或者作为某一操作的结果输出给用户。  
   
  用户和脚本都可以创建选中区。用户创建选中区的办法是拖曳文档的一部分。脚本创建选中区的办法是在文本区域或类似对象上调用   select   方法。要获取当前选中区，请对   document   对象应用   selection   关键字。要对选中区执行操作，请先用   createRange   方法从选中区创建一个文本区域对象。  
   
  一个文档同一时间只能有一个选中区。选中区的类型决定了其中为空或者包含文本和/或元素块。尽管空的选中区不包含任何内容，你仍然可以用它作为文档中的位置标志。

一个简单的例子

  1. <html><head><title>document.selection.createRange例子</title></head><body>
  2. <div>请选中这里的部分文字。</div><div><input type="button" value="加粗" onclick="javascript :Bold();" /></div>
  3. <script  language="javascript">
  4. function Bold(){
  5. var bo = document.selection.createRange();
  6. bo.execCommand("Bold");
  7. }</script>
  8. </body>
  9. </html>
    1. document.selection.createRange() 根据当前文字选择返回 TextRange 对象，或根据控件选择返回 ControlRange 对象。
    2. 配合 execCommand，在 HTML 编辑器中很有用，比如：文字加粗、斜体、复制、粘贴、创建超链接等。
    3. 实例一：
    4. <textarea cols=50 rows=15>
    5. 哈哈。我们都是新生来得。大家都来相互帮助呀。这样我们才能进步，我们才能赚大钱！</textarea>
    6. <input type=button value=选择字后点击我看看 onclick=alert(document.selection.createRange().text)>
    7. </form>
    8. 实例二：
    9. <body>
    10. <textarea name="textfield" cols="50" rows="6">就是现在文本域里有一段文字，当你选种其中几个字后点击一个按钮或者链接会弹出一个对话框，对话框的信息就是你选中的文字
    11. 哪位老大能解决的呀?请多多帮忙!!!谢谢
    12. </textarea>
    13. <input type="button" value="showSelection" onclick="alert(document.selection.createRange().text)">
    14. <input type="button" value="showclear" onclick="alert(document.selection.clear().text)">
    15. <input type="button" value="showtype" onclick="alert(document.selection.type)">
    16. <textarea name="textfield" cols="50" rows="6" onselect="alert(document.selection.createRange().text)">就是现在文本域里有一段文字，当你选种其中几个字后点击一个按钮或者链接会弹出一个对话框，对话框的信息就是你选中的文字
    17. 哪位老大能解决的呀?请多多帮忙!!!谢谢
    18. </textarea>
    19. </body>
    20. 实例三：选中Input中的文本
    21. <SCRIPT LANGUAGE="JavaScript">
    22. <!--
    23. function test2()
    24. {
    25. var t=document.getElementById("test")
    26. var o=t.createTextRange()
    27. alert(o.text)
    28. o.moveStart("character",2)
    29. alert(o.text)
    30. o.select()
    31. }
    32. //-->
    33. </SCRIPT>
    34. <input type='text' id='test' name='test'><input type=button onclick='test2()' value='test' name='test3'>
    35. 对textarea中的内容，进行选中后，加效果
    36. <script language="JavaScript">
    37. <!--
    38. function bold(){
    39. Qr=document.selection.createRange().text;
    40. if(!Qr || document.selection.createRange().parentElement().name!='description')
    41. {
    42. txt=prompt('Text to be made BOLD.','');
    43. if(txt!=null && txt!='') document.form1.description.value+=''+txt+'';
    44. }
    45. else{
    46. document.selection.createRange().text=''+document.selection.createRange().text+'';
    47. document.selection.empty();
    48. }
    49. }
    50. //-->
    51. </script>
    52. <input type="button" value="加粗" onclick="bold();" />
    53. <textarea name="description" style="width: 436px; height: 296px">选中我，点击加粗</textarea>
    54. 实例四：javascript捕获到选中的网页中的纯文本内容
    55. <html>
    56. <head>
    57. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    58. <title>鼠标取词</title>
    59. <script>
    60. function getSel()
    61. {
    62. var t=window.getSelection?window.getSelection():(document.getSelection?document.getSelection():(document.selection?document.selection.createRange().text:""))
    63. document.forms[0].selectedtext.value = t;
    64. }
    65. </script></head>
    66. <body onmouseup="getSel()">
    67. <form>
    68. <textarea name="selectedtext" rows="5" cols="50"></textarea>
    69. </form>
    70. 以上的代码可以捕获到选中的网页中的纯文本内容(不含HTML标签)
    71. 如果想获得包含html的内容，将document.selection.createRange().text改成document.selection.createRange().htmlText
    72. </body>
    73. </html>

js selection对象使用方法的更多相关文章

  1. JS：对象调方法1

    找调用者 1.如果有this,就先看this在哪个函数中,就是离this最近的function,没有就是window 2.找到函数后,辨别哪个是调用者 例1: 点击查看代码 function fn() ...

  2. 关于js的对象创建方法（简单工厂模式，构造函数模式，原型模式，混合模式，动态模式）

    // 1.工厂方式创建对象:面向对象中的封装函数(内置对象) 简单来说就是封装后的代码,简单的工厂模式是很好理解的,关于它的作用,就是利用面向对象的方法,把一些对象封装,使一些占用空间多的,重复的代码 ...

  3. 2 —— js语法 —— 对象和方法的声明 。变量提升。闭包

    一,声明对象 var obj1 = {}; var obj2 = {name:'kk',age:18,fun:function{          // name,age,fun为对象的属性,只是属性 ...

  4. JS打印对象的方法&将Object转换为String的函数

    1.有时候需要把对象中的字段属性打印出来,下面用JS实现输出对象: function writeObj(obj) { var description = ""; for (var ...

  5. js Math 对象的方法

    Math对象与JavaScript其他对象不同,因为用户不能生成所使用对象的副本,相反脚本汇集了简单Math对象的属性和方法.Math对象实际上存在于每个窗口和框架中,但是对脚本没有影响,程序员把这种 ...

  6. Js构造对象-添加方法的三种方式

    Js构造函数添加方法有多种方案,来看一个混合方式构造函数的例子:申明person构造函数,有两个属性,name,qq.在原型上添加方法showname.这是最常用的方法. <script> ...

  7. js遍历对象的方法

    1. for ... in 语句 for (let variable in object)  { ... } https://developer.mozilla.org/zh-CN/docs/Web/ ...

  8. JS数组对象的方法

    concat 返回一个新数组,这个数组是由两个或更多数组组合而成的 array.concat(b,c); join 返回字符串值,其中包括了连接到一起的数组的所有元素,元素由指定分隔符分割开来 arr ...

  9. JS 打印对象的方法

      2 3 4 5 6 7 8 function writeObj(obj){  var description = "";  for(var i in obj){   var p ...

随机推荐

  1. sqlserver2008r2通过发布和订阅的方式进行数据库同步

    发布服务器:192.168.8.16 订阅服务器:192.168.8.92 发布服务器配置: 选择需要发布的数据库,这里是Attendace_new 订阅服务器配置: 在订阅服务器上新建一个数据库:d ...

  2. Ex 3_25 图中每个顶点有一个相关价格..._十一次作业

    (a)首先对有向无环图进行拓扑排序,再按拓扑排序的逆序依次计算每个顶点的cost值,每个顶点的cost值为自身的price值与相邻顶点间的cost值得最小值 (b)求出图中的每一个强连通分量,并把所有 ...

  3. Python-HTML 最强标签分类

    编程: 使用(展示)数据 存储数据 处理数据 前端 1. 前端是做什么的? 2. 我们为什么要学前端? 3. 前端都有哪些内容? 1. HTML 2. CSS 3. JavaScript 4.jQue ...

  4. java多线程快速入门（十）

    synchonizd解决安全性问题 package com.cppdy; class MyThread6 implements Runnable{ private Integer ticketCoun ...

  5. Linux下搭建ruby on rails环境

    要搭建的东西:Ruby 1.8.7,Rails 2.3.8,rubygem 1.3.7 1.安装ruby sudo apt-get install ruby-full 2.安装rubygem sudo ...

  6. 使用ssh命令进行远程登录

    1.查看SSH客户端版本 有的时候需要确认一下SSH客户端及其相应的版本号.使用ssh -V命令可以得到版本号.需要注意的是,Linux一般自带的是OpenSSH: 下面的例子即表明该系统正在使用Op ...

  7. 记录weiye项目上线遇到的一些问题

    1.使用vpn访问客户内网 参考:http://jingyan.baidu.com/article/a3f121e4f9903cfc9052bb0b.html 2.设置使用ip地址直接访问项目(之后可 ...

  8. 用HTML+CSS画出一个同心圆

    参加web前端校招的同学们经常会遇到这样的面试题:用HTML+CSS画出一个同心圆. 例如: 这道题主要考验的是基础盒模型布局能力和倒圆角属性的巧用. 1.html代码 <body> &l ...

  9. BZOJ1801 [Ahoi2009]chess 中国象棋 动态规划

    欢迎访问~原文出处——博客园-zhouzhendong 去博客园看该题解 题目传送门 - BZOJ1801 题意概括 在N行M列的棋盘上,放若干个炮可以是0个,使得没有任何一个炮可以攻击另一个炮. 请 ...

  10. 第三章XML简介

    概念:XML:提供数据交换.系统配置.内容管理等的功能,可跨平台.跨网络.跨程序的数据描述方式.XSL:依靠XPath定位,提供显示模板,且专门为了显示XML文件信息的语言.CSS(层叠样式表):在网 ...