09JavaScript 必学!轻松搞定文本操作兼容性,3 步实现 div 内容迁移

目录

innerText和textContent区别

【兼容性封装】innerText和textContent

【案例】获取一个 div 内容并设置给另一个 div


非 VIP 用户可前往公众号“前端基地”进行免费阅读,文章链接如下:

09JavaScript 必学!轻松搞定文本操作兼容性,3 步实现 div 内容迁移

innerText和textContent区别


        innerText:它是微软为 Internet Explorer 浏览器所定义的属性,之后被众多浏览器广泛支持。不过在早期的 Firefox 浏览器特定版本中无法使用该属性。innerText 会考虑元素的样式和可见性,它只返回可见的文本内容。《详见:01JavaScript基础操作:元素获取与事件处理中innerText内容》

        textContent:这是后续出现的属性,其功能和 innerText 类似,用于获取或设置元素的文本内容。所有现代高级浏览器都支持该属性,但在低版本浏览器(如 IE6、7、8)中无法使用,使用时获取元素对象的文本内容会返回 undefined。textContent 会返回元素内的所有文本内容,不管其是否可见。

        示例代码如下:


    

box

   

你可能感兴趣的:(JavaScript,开发,文本内容操作,浏览器兼容性,innerText,textContent,前端代码优化,Web,开发技巧)