文档库 最新最全的文档下载
当前位置:文档库 › JavaScript 中在光标处插入添加文本标签节点 详细方法

JavaScript 中在光标处插入添加文本标签节点 详细方法

JavaScript 中在光标处插入添加文本标签节点 详细方法
JavaScript 中在光标处插入添加文本标签节点 详细方法

JavaScript 中在光标处插入添加文本标签节点详细方法

正确的方法是正确运用Selection对象和Range对象,实现在光标当前位置插入文本或结点。但是这两个对象在IE和标准的DOM方式的运用方法是不同的。

思路:首先获得用户的选区(光标当前位置可理解成起始和终止位置一样的选区)。然后,从Selection对象转成Range对象。目的是利用Range对象的方法插内容进去。最后,插入动作结束后将光标移到插入内容的后面。

1.var sel = win.document.selection; //IE

2.var sel = win.getSelection(); //DOM

3.

4.var range = sel.createRange(); // IE下

5.var range = sel.getRangeAt(0); // DOM下

6.

7.if(range.startContainer){ // DOM下

8. sel.removeAllRanges(); // 删除Selection中的所有Range

9. range.deleteContents(); // 清除Range中的内容

10. // 获得Range中的第一个html结点

11. var container = range.startContainer;

12. // 获得Range起点的位移

13. var pos = range.startOffset;

14. // 建一个空Range

15. range = document.createRange();

16. // 插入内容

17. var cons = win.document.createTextNode(",:),");

18.

19. if(container.nodeType == 3){// 如是一个TextNode

20. container.insertData(pos, cons.nodeValue);

21. // 改变光标位置

22. range.setEnd(container, pos + cons.nodeValue.length);

23. range.setStart(container, pos + cons.nodeValue.length);

24. }else{// 如果是一个HTML Node

25. var afternode = container.childNodes[pos];

26. container.insertBefore(cons, afternode);

27.

28. range.setEnd(cons, cons.nodeValue.length);

29. range.setStart(cons, cons.nodeValue.length);

30. }

31. sel.addRange(range);

32.}else{// IE下

33. var cnode = range.parentElement();

34. while(cnode.tagName.toLowerCase() != “body”){

35. cnodecnode = cnode.parentNode;

36. }

37. if(cnode.id && cnode.id==”rich_txt_editor”){

38. range.pasteHTML(",:),");

39. }

40.}

41.win.focus();

innerHTML 和pasteHTML 区别

innerHTML 是一个属性,可以取得或者设定该元素内的HTML 内容,可以是任意能包含HTML 子节点的元素都使用它

pasteHTML()是一个方法,在指定的文字区域内替换该区域内的文本或者HTML,该方法必须应用于一个createTextRange() 或者document.selection.createRange() 创建的区域上

1.var oRange = document.selection.createRange();

2.if(oRange.text!=''){

3.var oHtml = 'oRange.text';

4. oRange.pasteHTML(oHtml);

5. }

web前端基础知识

2012-5-15 [成就源于整理] | oush [深圳残 友动漫] 静态页面效果代码

目录 1.获取当前日期和星期 (2) 2.繁简中文转换 (2) 3.支持ff和ie的滤镜效果样式 (2) 4.让ie6实现li的hover事件代码 (3) 5.首页菜单效果 (3) 6.鼠标经过时菜单显示不一样的背景js (5) 7.banner效果 (6) 8.兼容两种浏览器,通常方法 (6) 9.用样式实现div的圆角 (7) 10.如何在ie6及更早浏览器中定义小调试的容器 (7) 11. 如何解决IE6及更早浏览器浮动时产生双倍边距的BUG (7) 12. 如何在IE6及更早浏览器下模拟min-height效果 (7) 13.如何解决按钮在IE7及更早浏览器下随着value增多两边留白也随着增加的问题.. 8 14.如何解决IE7及更早浏览器下当li中出现2个或以上的浮动时,li之间产生的空白间隙的BUG (8) 15.如何解决IE6下的文本溢出BUG (8) 16.如何使文本溢出边界显示为省略号 (8) 17. 如何使连续的长字符串自动换行 (9) 18.如何让已知高度的容器在页面中水平垂直居中 (9) 19. 如何做1像素细边框的table (9) 20. 如何在点文字时也选中复选框或单选框 (9) 21.渐变背景色css3 (9) 22.加载在线jquery (10) 23.鼠标经过时宽度加长 (10) 24.跳转下拉菜单 (10) 25.去除超链接虚线框 (10) 26.显示子菜单封装类 (10) 27. 实现图片延迟加载 (11) 28.动态获取当前时间 (11) 29.百度地图API,地图生成工具 (12) 30.返回到顶部 (12) 31.刷新页面的js方法 (13) 32.固定层div样式 (13) 33.高级样式 (13) 34.激活hasLayout (14)

JS实例网页上图片延迟加载的JS代码

大家如果使用firebug去查看的话就会发现,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对于比较长的页面来说,这个方案是比较好的。 实现原理 把所有需要延时加载的图片改成如下的格式: 然后在页面加载时,把所有使用了lazy_src的图片都保存到数组里,然后在滚动时计算可视区域的top,然后把延时加载的图片中top小于当前可视区域(即图片出现在可视区域内)的图片的src的值用lazy_src的来替换(加载图片) 代码 lazyLoad=(function() { var map_element = {}; var element_obj = []; var download_count = 0; var last_offset = -1; var doc_body; var doc_element; var lazy_load_tag; function initVar(tags) { doc_body = document.body; doc_element = https://www.wendangku.net/doc/c310256600.html,patMode == 'BackCompat' ? doc_body: document.documentElement; lazy_load_tag = tags || ["img", "iframe"]; }; function initElementMap() { var all_element = []; //从所有相关元素中找出需要延时加载的元素 for (var i = 0, len = lazy_load_tag.length; i < len; i++) { var el = document.getElementsByTagName(lazy_load_tag[i]); for (var j = 0, len2 = el.length; j < len2; j++) { if (typeof(el[j]) == "object" && el[j].getAttribute("lazy_src")) { element_obj.push(all_element[key]); } } } for (var i = 0,

Access窗体操作技巧题

Access窗体操作题 2、考生文件夹下存在一个数据库文件"Access3.mdb",里面已经设计好窗体对象"教师"。试在此基础上按照以下要求补充窗体设计: (1)在窗体的窗体页眉节区位置添加一个标签控件,其名称为"bTitle",标题显示为"教师奖励信息";(2)在主体节区位置添加一个选项组控件,将其命名为"opt",选项组标签显示内容为"奖励",名称为"bopt"; (3)在选项组内放置二个单选按钮控件,选项按钮分别命名为"opt1"和"opt2",选项按钮标签显示内容分别为"有"和"无",名称分别为"bopt1"和"bopt2"。 (4)在窗体页脚节区位置添加两个命令按钮,分别命名为"bOk"和"bQuit",按钮标题分别为"确定"和"退出"; (5)将窗体标题设置为"教师奖励信息"。 注意:不允许修改窗体对象"教师"中已设置好的属性。 等级:3 难度:3 知识点:access知识点/窗体题 3、考生文件夹下存在一个数据库文件"Access3.mdb",里面已经设计好窗体对象"教师"。试在此基础上按照一下要求补充窗体设计: (1)在窗体的窗体页眉节区位置添加一个标签控件,其名称为"bTitle",标题显示为"教师基本信息输出";(2)在主体节区中"年龄"标签右侧的文本框显示内容设置为"年龄"字段值,并将文本框名称更名为"tAge";(3)在主体节区添加一个标签控件,该控件放置在距左边0.1厘米、距上边5.0厘米,标签显示内容为"出生地",名称为"bMem"; (4)在窗体页脚节区位置添加两个命令按钮,分别命名为"bOk"和"bQuit",按钮标题分别为"确定"和"退出"; (5)将窗体标题设置为"教师基本信息"。 注意:不允许修改窗体对象"教师"中未涉及的控件和属性。

js异步加载

js异步加载: 关键词:异步加载(async loading),延迟加载(lazy loading),延迟执行(lazy execution),async 属性,defer 属性 一、同步加载与异步加载的形式 1. 同步加载 我们平时最常使用的就是这种同步加载形式: 同步模式,又称阻塞模式,会阻止浏览器的后续处理,停止了后续的解析,因此停止了后续的文件加载(如图像)、渲染、代码执行。 js 之所以要同步执行,是因为js 中可能有输出document 内容、修改dom、重定向等行为,所以默认同步执行才是安全的。 以前的一般建议是把