javascript IE浏览器与标准浏览器的获取范围及替换文本

cdcdhj

于 2023-09-20 20:14:08 发布

阅读量79

点赞数

分类专栏： javascript学习日记文章标签： javascript 开发语言

本文链接：https://blog.csdn.net/cdcdhj/article/details/133097973

版权

javascript学习日记专栏收录该内容

142 篇文章 0 订阅

订阅专栏

文章讲述了如何使用JavaScript在不同浏览器环境下（IE和标准浏览器）实现文本内容的查找并替换，展示了创建Range对象、处理DOM节点和文本内容的操作。

摘要由CSDN通过智能技术生成

			 var range='';
           var p1=document.getElementById("p1");
			//判断是IE还是标准浏览器
            if(window.ActiveXObject)
            {
            //IE创建范围
              range=document.body.createTextRange();
              //获取标签范围
              range.moveToElementText(p1);
              //获取标签范围的父节点，再找到子节点
              var pNode=range.parentElement().childNodes[0];
              //给子节点字体颜色 
              pNode.style.color="red";
              //找到文本
              range.findText("hello xibi");
              //对文本进行替换
              range.text="taobao";
              
            }else if(document.implementation && typeof document.createRange=="function")
            {
            //这个是标准浏览器的获取范围与找到文本，然后进行删除，创建文本加入子节点
              range=document.createRange();
              var div=range.selectNode(p1);
              var p2=range.startContainer.childNodes[1].firstChild;
              p2.style.color="red";
              var text=range.selectNodeContents(p2);
              range.deleteContents();
              var t=document.createTextNode("taobao");
              p2.appendChild(t);

              console.log(range.startContainer);
              range.detach();
              range=null;
              t=null;
              
            }