- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我希望您能够解决我的问题,我花了 3 个小时试图解决它。
首先,我有大约一千个包含数字或点的跨度标签。它用作库的标题,数字代表列的 ID,仅显示偶数,奇数用点替换以避免数字重叠。遗憾的是,我可以使用除 span 标签之外的任何内容,因为库就是这样工作的。
<div class="marker" style="font-size: 10px;">
<span>
<span class="header" style="width: 15px; display: inline-block;">.</span>
<span class="header" style="width: 15px; display: inline-block;">2</span>
<span class="header" style="width: 15px; display: inline-block;">.</span>
<span class="header" style="width: 15px; display: inline-block;">4</span>
. .
. .
. .
<span class="header" style="width: 15px; display: inline-block;">936</span>
<span class="header" style="width: 15px; display: inline-block;">.</span>
<span class="header" style="width: 15px; display: inline-block;">938</span>
</span>
</div>
我的目标是更改数字(即列 ID)。为此,我有一个二维数组,其中包含我要更改的数字(左)和新数字(右)。例如:
var arrayCorres = [[448, 603], ... ,[345, 666] ]
在此示例中,列 ID 448 将在列 ID 603 中更改,对于 345 到 666 也是如此。arrayCorres
中不存在的列 ID 将更改为空白列 ID。
因此,我创建了以下函数来在数组中搜索列 id 的新值:
function changeId(array,value){
for (ite = 0; ite < array.length; ite++){
if (value == array[ite][0]){
return(array[ite][1]);
}
}
}
此函数返回新的列 ID,如果列 ID 不在数组中,则返回 未定义
,这意味着必须将其更改为空白列 ID。
现在我使用此函数通过在参数中给出其 id 来更新单个 span 标签:
function newSpanId(array,id){
var tmp = changeId(array,id);
if (tmp!=undefined){
$(".marker").find('span')[id].innerText=tmp;
}
else {
$(".marker").find('span')[id].innerText="";
}
}
现在,正如您可能已经猜到的,我想更新所有的 span 标记 ID。
我使用以下函数:
function updateSpans(array){
var max = ($(".marker").find('span').length );
for (ite = 1; ite < max; ite++){
newSpanId(array,ite);
}
}
我面临的问题是 newSpanId(array,id)
效果很好,它根据参数中给出的数组将范围 ID 更改为新的,但是当我使用 updateSpans(array)
,我在“Unresponsive Script”的 firebug 中收到错误:
A script on this page may be busy, or it may have stopped responding. You can stop the script now, open the script in the debugger, or let the script continue.
如何让所有的span标签都更新?感谢您的宝贵时间!
最佳答案
您可以使用 $.each()
迭代数组,使用 filter()
匹配 .header
元素,其中 .textContent
等于当前数组第一个索引处的数字,.text()
设置新的文本内容
var arrayCorres = [
[448, 603],
[345, 666]
];
$.each(arrayCorres, function(index, arr) {
$(".header").filter(function(index, el) {
return el.textContent == arr[0]
})
.text(arr[1])
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<div class="marker" style="font-size: 10px;">
<span>
<span class="header" style="width: 15px; display: inline-block;">.</span>
<span class="header" style="width: 15px; display: inline-block;">448</span>
<span class="header" style="width: 15px; display: inline-block;">.</span>
<span class="header" style="width: 15px; display: inline-block;">345</span>
<span class="header" style="width: 15px; display: inline-block;">936</span>
<span class="header" style="width: 15px; display: inline-block;">.</span>
<span class="header" style="width: 15px; display: inline-block;">938</span>
</span>
</div>
jsfiddle https://jsfiddle.net/1cjxh5o2/
关于javascript - 更改多个span标签的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45193321/
我有一个模式来匹配类似的东西 ... 1036 ... 但是我不想匹配 1036 因为会抓 1036 但无论如何我不想捕获双倍跨度,因为我不需要这些数据。我需要跨度和行尾之间的数据。 我在跨度的末尾尝
如何使用正则表达式来匹配该字符串: regularexpression . 如何交换第一个跨度的内容和第二个跨度的内容。 我认为可以使用jquery源码。 最佳答案 请务必阅读 RegEx match
我正在测试一个指令,该指令会在 200 个字符后 chop 文本。它改变了这一点: 对此: long text long text long text long text long
我有代码将这个字符串解析成一个字符数组: var textArray = Regex.Replace(text, @"]*|/)?>", String.Empty).Trim().ToCharA
我正在尝试使用 BeautifulSoup 提取包含在 id="titleDescription"范围内的字符串。 Customer Choice Award Winner
Hello
拆分为 Hello如何分割Hello至 Hello使用javascript var text = "Hello"; 记住:我不知道什么包含 , 我不知道 有没有属性 我找到了答案! var patt=/^(.*)$/i
我有一个数组列表 ArrayList al = new ArrayList(); al.add("tree good has"); al.add("ok go by"); al.add
我有一个使用 span 的 html 文件关键字以两种不同的方式。 第一个在第二个定义中 button.groovyButton span这里: button.groovyButton { b
仍在尝试让新站点的导航控件按照我想要的方式工作。 我将我的问题简化为这段代码: Test span { display: inline-block; heigh
This is 城市。它因 而闻名。
”我是编码新手 在下面的 pgm 中,任何人都可以帮我找出为什么 ng-bind 不起作用吗? 提前致谢。 Angular js Welocme!Please enter valu
我必须在下面的 html 代码中提取文本内容以进行 python 网络抓取,问题是类参数,所有三个变量都具有相同的类参数,所以我尝试使用 arial-label,但它不起作用。 2, 3 Proper
如何填充一组 带有一个带有循环的单词数组? 如果数组包含[ "one", "two", "three" ]并被称为“wordarray” 然后我想填充跨度,使其看起来像 one two
如果我们有 div 并且没有跨度,即一个跨度中的跨度,并且每个跨度都有一种颜色样式,如何使用 css 或 jquery 覆盖特定样式[颜色]..。请帮助我 最佳答案 你的意思是这样的吗? red bl
我以为下面的选择器只会匹配example b。有人可以向我解释一下 CSS 路径的工作原理吗? body div span a{ background:#000; color:#fff
我正在尝试获取内可用的文本元素。我已经使用innerHTML来检索内部文本,但很少元素内部文本放置在 内元素。 在检索文本值时,将其获取为 sample text作为输出字符串。谁能帮我删除 在输出
我应该加上“n” (显示“n”flaticon-icons)到一个div(我的页面是.php) 这是 div 这是 div_icon CSS 类 @media (max-width: 600px
无法获取“表格”中的跨度文本,谢谢! from bs4 import BeautifulSoup import urllib2 url1 = "url" content1 = urllib2.urlo
这个问题在这里已经有了答案: My inline-block elements are not lining up properly (5 个答案) 关闭 8 年前。 HTML $ 400 这会在同
我正在尽力在图像中插入 span 标签标题。 两者都在段落和 span 标签内。 如何让 lorem ipsum 文本作为标题出现在图像的底部?? Lorem ipsum dolor
我有以下 HTML 文件。 "| Testing" 我要打印 "| Testing" , 而不是打印这个打印 "| Testing" .所有这
我是一名优秀的程序员,十分优秀!