javascript - 有没有办法将 css 应用于元素的一部分?

标签 javascript html css

我正在寻找一种仅将新 CSS 应用于元素的一部分的方法。

例如。原始的 HTML 看起来像

<p>123456</p>

我只想把 456 变成粗体。

当然,我可以通过在456中添加另一个标签来实现

<p>123<b>456</b></p>

但在我的应用程序中,我不想改变原来的 DOM 结构。通过添加新标签,我更改了 DOM 结构。

为此,我正在考虑向现有标签添加新的自定义属性,例如

<p data-wms="e-3">123456</p>

这里的data-wms表示有特殊的部分,e-3表示从索引3的字符(这里是4)到结尾会有一个特殊的属性(比如本例中的粗体)

现在我有了关于在元素内部进行更改的所有信息。

但是,我如何在不添加标签、不更改 dom 的情况下使用 javascript 做到这一点。

谢谢

最佳答案

您可以使用 span 元素来执行此操作,它专门用于处理内联样式,同时保持整体结构。

一个例子是:

<p>123<span class="bold-highlight">456</span></p>

关于javascript - 有没有办法将 css 应用于元素的一部分?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66620101/

相关文章:

javascript - Jquery 动画移动元素根本不起作用

jquery - 获取父 div 的类名并将其用作新 jQuery 函数的选择器

php - Javascript .replace 在页面加载时被重写

javascript - 使用 Fabric JS 设置线条对象的渐变

javascript - 获取对象中的重复项并合并值

javascript - HTML + (NV)D3 : Can't place a div on top of a div of the chart even with > z-index

javascript - Google Chrome 中的 Knockout.js 输入类型日期数据绑定(bind)

jquery - 添加新 div 时背景图像不透明度增加

javascript - 多个自定义 Vimeo 播放按钮

javascript - 如何在服务帐户调用 Google oAuth 时处理 CORS?