CSS は JavaScript を使用せずに外部ページのテキスト入力を検出できますか?

制御不能な外部ページで CSS を使用してテキスト入力を検出する

CSS のみを使用して入力フィールドにテキストが含まれているかどうかを判断するには、次のことを考慮します。プレースホルダー属性を使用します。プレースホルダーは必要で空にすることはできませんが、単一のスペースに設定できます。

CSS ルールの適用:

input:not(:placeholder-shown) {
  border-color: green;
}

input:placeholder-shown {
  border-color: red;
}

デモ:

<input placeholder="Text is required" />
<input placeholder=" " value="This one is valid" />
<input placeholder=" " />

この例では、プレースホルダーを含む入力と、テキストには緑色の枠があり、空であることを示します。逆に、プレースホルダーとテキスト、またはスペースのみのプレースホルダーと値を含む入力には赤い枠線が表示されます。

補足:

• このメソッドが機能するのは、:placeholder-shown が、表示されている要素と一致する疑似クラスであるためです。 placeholder.
• :placeholder-shon は、すべての主要なブラウザでサポートされています。

以上がCSS は JavaScript を使用せずに外部ページのテキスト入力を検出できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。