javascript - 通过 JavaScript 获取输入的 CSS 转换值

Question

考虑以下场景:

HTML

<input type="text" id="source" value="the quick brown fox">
<input type="text" id="target">

CSS

#source
{
  text-transform: capitalize;
}

JavaScript

function element(id) {
  return document.getElementById(id);
}

element('target').value = element('source').value;

---

在 CSS 样式化之后，#source 应该显示“The Quick Brown Fox”。

目标是获取 text-transform-ed 值并将其转储到 #target 中。这有可能实现吗？

Answer 1

没有。您需要使用 JavaScript 对其进行物理转换

假设您已经知道 source 是文本转换为大写的，您可以这样做

window.onload=function() {
  document.getElementById("source").onblur=function() {
    var tgt = document.getElementById("target");
    var capitalised = [];
    var parts = this.value.split(" ");
    for (var i=0;i<parts.length;i++) {
      capitalised.push(parts[i].substring(0,1).toUpperCase()+parts[i].substring(1));
    }
    tgt.value=capitalised.join(" ");
  }
}