Javascript 获取准确的浏览器渲染文本（RTL和LTR方向混合）
是否有办法通过浏览器检索实际渲染的文本（在从右到左文本方向的上下文中）Javascript 获取准确的浏览器渲染文本（RTL和LTR方向混合）,javascript,html,right-to-left,bidi,Javascript,Html,Right To Left,Bidi,是否有办法通过浏览器检索实际渲染的文本（在从右到左文本方向的上下文中） 你好（世界） 你好（世界） 将呈现： 含铬 在firefox中 但两者都有 document.getElementById（'ok'）。textContent==document.getElementById（'ko'）。textContent 及 document.getElementById（'ok'）。innerText==document.getElementById（'ko'）。innerText为
你好（世界）
你好（世界）
- 含铬
- 在firefox中
document.getElementById（'ok'）。textContent==document.getElementById（'ko'）。textContentdocument.getElementById（'ok'）。innerText==document.getElementById（'ko'）。innerTexttrue有一个
方向getComputedStyle（elem）- 首先从容器中抓取所有textNodes（最好使用一个）
- 使用
- 通过范围的方法获取每个角色的当前位置
- 分类
- 获取它们的文本值
函数getDisplayedText（容器）{
var r=document.createRange（）；//获取节点位置
var nodes=[]；//首先获取所有节点
var treeWalker=document.createTreeWalker（容器，NodeFilter.SHOW_TEXT，null，false）；
while（treeWalker.nextNode（））nodes.push（treeWalker.currentNode）；
var chars=[]；//然后获取其包含的所有字符
nodes.forEach（n=>{
n、 data.split（“”）.forEach（（c，i）=>{
r、 setStart（n，i）；//将范围移动到此字符
r、 设定值（n，i+1）；
推({
案文：c，
rect:r.getBoundingClientRect（）//保存范围的DOMRect
})
})
});
return chars.filter（c=>c.rect.height）//只保留显示的字符（即没有脚本文本内容）
.sort（（a，b）=>{//sort ttb ltr
if（a.rect.top==b.rect.top）{
返回a.rect.left-b.rect.left；
}
返回a.rect.top-b.rect.top；
})
.map（n=>n.text）
.加入（“”）；
}
log（'ko:'，getDisplayedText（ko））；
log（'ok:'，getDisplayedText（ok））
你好（世界）
你好（世界）
有一个方向
CSS属性，您可以从中获取，例如getComputedStyle（elem）
，但这只是在元素级别，因此您无法确切知道浏览器是如何呈现textNodes的
因此，您需要做的是：
- 首先从容器中抓取所有textNodes（最好使用一个）
- 使用
- 通过范围的方法获取每个角色的当前位置
- 分类
- 获取它们的文本值
这是一个现场演示：
函数getDisplayedText（容器）{
var r=document.createRange（）；//获取节点位置
var nodes=[]；//首先获取所有节点
var treeWalker=document.createTreeWalker（容器，NodeFilter.SHOW_TEXT，null，false）；
while（treeWalker.nextNode（））nodes.push（treeWalker.currentNode）；
var chars=[]；//然后获取其包含的所有字符
nodes.forEach（n=>{
n、 data.split（“”）.forEach（（c，i）=>{
r、 setStart（n，i）；//将范围移动到此字符
r、 设定值（n，i+1）；
推({
案文：c，
rect:r.getBoundingClientRect（）//保存范围的DOMRect
})
})
});
return chars.filter（c=>c.rect.height）//只保留显示的字符（即没有脚本文本内容）
.sort（（a，b）=>{//sort ttb ltr
if（a.rect.top==b.rect.top）{
返回a.rect.left-b.rect.left；
}
返回a.rect.top-b.rect.top；
})
.map（n=>n.text）
.加入（“”）；
}
log（'ko:'，getDisplayedText（ko））；
log（'ok:'，getDisplayedText（ok））
你好（世界）
你好（世界）
<html dir="rtl">
<body>
<p id='ko'>Hello (world)</p>
<p id='ok'>Hello <bdo dir='ltr'>(world)</bdo></p>
</body>
</html>