javascript获取div的内容 精华篇

原理:采用innerText 或者 innerHTML


代码如下:

<script language=”javascript”>
var stock_code = stockcode.innerText;
var stock_code = stockcode.innerHTML;
</script>
<div id="stockcode" style="display:none">
test
</div>

innerText 跟 innerHTML是两个非DOM标准的方法
其区别如图所示:
(图中应该为innerText)

在IE中 innerText 跟 inner HTML 两个方法都能正常运行

但是FF里面的innerText不可用,但是有一个替代方法: textContent

IE: oDiv.innerText = aString; oDiv.innerHTML = aString;
FF: oDiv.textContent = aString; oDiv.innerHTML = aString;

Ajax in action 的作者之一Eric 用正则表达式 实现了 一个兼容方法,比较有趣
Hope this helps
A little smirk
One day a secretary is leaving on her lunch break, and she notices her boss standing in front of a shredder with a clueless look on his face. The secretary walks up to him and asks if he needs help.
"Yes!" he says looking and sounding relieved, "This is very important."
Glad to help, she turns the shredder on and inserts the paper. Then her boss says, "Thanks, I only need one copy."
Create function like innerText
As you may have figured out innerText is IE only. That means that browsers like Mozilla, Firefox, and Netscape will return undefined. If you do not know what innerText does, it strips out all of the tags so you only see the text.
For example, if a div contains the HTML <span id='span1'>Eric</span>, innerHTML would return <span id='span1'>Eric</span> while innerText will return Eric.
Now to make innerHTML act the same we need to use some regular expressions with the strings replace() method.
Now the basic pattern we need to match is or or or
Now the regular expression we need to use is /<\/?[^>]+>/gi
If you do not know regular expressions here is a quick explanation:
/ - Starts the regular expression
< - Match the less than sign
\/ - Escape the character / so it can be matched (Without the \ you would be saying it is the end of the reg exp.)
? - Match the / character 0 or 1 times
[^>] - Match any character but greater than sign
+ - Match [^>] one or more times
> - Match greater than sign
/ - End the regular expression
gi - Tells regular expression to match global and ignore the case
So now the function to replace the text would look like:


代码如下:

<script type="text/javascript">
var regExp = /<\/?[^>]+>/gi;
function ReplaceTags(xStr){
xStr = xStr.replace(regExp,"");
return xStr;
}
</script>

All you need to do is pass it a string and it returns the string stripped of the tags.
An example is shown below to grab the text from a div without the tags.

var regExp = /]+>/gi;
function ReplaceTags(xStr){
xStr = xStr.replace(regExp,"");
return xStr;
}

Test Test Test
Wow!

var xContent = document.getElementById("test").innerHTML;
var fixedContent = ReplaceTags(xContent);
alert(fixedContent);

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(0)

相关推荐

  • javascript获取div的内容 精华篇

    原理:采用innerText 或者 innerHTML 复制代码 代码如下: <script language="javascript"> var stock_code = stockcode.innerText; var stock_code = stockcode.innerHTML; </script> <div id="stockcode" style="display:none"> test <

  • 关于获取DIV内部内容报错的原因分析及解决办法

    1.错误描述 2.错误原因 由于向div中添加元素,利用append(); $("#divStyle").append("<div><label>_data[i].name</label></div>"); append里面是动态数据,当请求数据为空时,获取并判断div中的内容: var divContent = $("#divStyle").html(); if(divContent == nul

  • javascript获取元素文本内容的通用函数

    一个获取元素文本内容的通用函数 中华人民共和国1 2 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 将HTML DOM中几个容易常用的属性做下记录: nodeName.nodeValue 以及 nodeType 包含有关于节点的信息. nodeName 属性含有某个节点的名称. 元素节点的 nodeName 是标签名称 属性节点的 nodeName 是属性名称 文本节点的 nodeName 永远是 #text 文档节点的 nodeName 永远是 #document 注释:node

  • JavaScript和JQuery获取DIV值的方法示例

    本文实例讲述了JavaScript和JQuery获取DIV值的方法.分享给大家供大家参考,具体如下: 1.示例代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtm

  • JavaScript获取URL参数的方法分享

    目录 一.字符串 split 方法 二.使用 URLSearchParams 方法 1.解析搜索字符串 2.生成搜索字符串 3.Node.js 代码 三.使用正则匹配方法 四.使用第三方库 qs 一.字符串 split 方法 url 地址是字符串形式的,所以利用 split 方法将参数提取出来,该方法比较常用,而且容易理解(无关正则) let URL = "http://www.baidu.com?name=小宇&age=25&sex=男&wife=小君"; f

  • js下获取div中的数据的原理分析

    关于从中学到的知识: document.getelementbyid("ddhdh").innerHTML 可以获取到div中的全部数据,包括标签...但是只是在IE和OPERA中使用 document.getelementbyid("ddhdh").innerTEXT 可以获取到div中的文本数据,不会获取到标签...但是只是在IE和OPERA中使用 document.getElementById("text").textContent 用于在

  • 用JavaScript获取页面文档内容的实现代码

    JavaScript的document对象包含了页面的实际内容,所以利用document对象可以获取页面内容,例如页面标题.各个表单值. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js基础</title> </head> <body> <p>一. 用Documen

  • js实现文本框中输入文字页面中div层同步获取文本框内容的方法

    本文实例讲述了js实现文本框中输入文字页面中div层同步获取文本框内容的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.o

  • python的xpath获取div标签内html内容,实现innerhtml功能的方法

    python的xpath没有获取div标签内html内容的功能,也就是获取div或a标签中的innerhtml,写了个小程序实现一下: 源代码 [webadmin@centos7 csdnd4q] #162> vim /mywork/python/csdnd4q/z040.py #去掉最外层标签,保留其内的所有html标记和文本 def getinnerhtml(data): return data[data.find(">")+1:data.rfind("<

  • 在python中获取div的文本内容并和想定结果进行对比详解

    div的内容为: <div style="background-color: rgb(255, 238, 221);" id="status" class="errors">您输入的用户名或密码有误.</div> # coding:utf-8 from selenium import webdriver browser = webdriver.Firefox() url = 'file:///C:/Users/li/Des

随机推荐