Question

我有以下HTML。

<div>this is line 1 {start-hidden}</div>
<div>this is line 2</div>
<div>{end-hidden} this is line 3</div>

我希望{start-hidden}和{end-hidden}之间的文字不可见。我怎样才能做到这一点？请注意，“start-hidden”和“end-hidden”可能位于不同的位置。它有一些额外的标记。

我需要一些花哨的正则表达式，还是使用服务器端DOM操作会更好？

感谢。

我使用的解决方案（使用PHP）（对于那些感兴趣的人）：

正则表达式提取{start-hidden}和{end-hidden} [调用此部分$ inner]内的所有文本（+ html）以及[$ pre]之前和[$ post]之后的所有文本。

preg_match('#^(.*?){start-hidden}(.*?){end-hidden}(.*?)$#is', $source, $matches)

然后删除$ inner中任何新行的原因。只删除带有结束标签的那些。

// attempt to remove all sources of new lines
$inner = preg_replace('#<br([^>])*>#is', '', $inner);
$inner = preg_replace('#<div([^>])*>(.*?)</div>#is', '', $inner);
$inner = preg_replace('#<p([^>])*>(.*?)</p>#is', '', $inner);

然后我们找到每个剩余的标签和前缀＆lt; / span＆gt;并附加＆lt; span class =“hidden”＆gt;。

$inner = preg_replace('#(<[^>]+>)#is', '</span>${1}<span class="hidden">', $inner),

然后使用＆lt; span class =“hidden”＆gt;前缀$ inner;并附加＆lt; / span＆gt;

$inner = '<span class="hidden">' . $inner . '</span>';

最后将它们全部重新加入（如果你能再次使用preg_match（），请重复）。

$source  = $pre;
$source .= $inner;
$source .= $post;

Answer 1

{start-hidden}和{end-hidden}是否必须在and标签内？坚持使用html会建议使用类似的东西（根据你的建议将样式“打破”div是没有意义的）：

<div>this is line 1</div>
<div style="display:none;">this is line 2</div>
<div>this is line 3</div>

或者，正如gred所建议的那样：

<div>this is line 1</div>
<div style="visibility:hidden;">this is line 2</div>
<div>this is line 3</div>

编辑：了解display:none和visibility:hidden之间的区别非常重要：w3schools on display vs. visibility

Answer 2

使用范围：

<div>this is line 1 <span style="visibility:hidden;">{start-hidden}</span></div>
<div>this is line 2</div>
<div><span style="visibility:hidden;">{end-hidden}</span> this is line 3</div>

如何将格式应用于几个div的文本区域。

2 个答案: