vueで要素の内容を取得する方法

下次还敢
リリース: 2024-05-02 22:45:43
オリジナル
1080 人が閲覧しました

Vue で要素コンテンツを取得するメソッドは次のとおりです。 textContent: 改行やテキスト ノードを含むすべてのテキスト コンテンツを取得します。 innerText: 改行とテキスト ノードを除いたビジュアル テキスト コンテンツを取得します。 innerHTML: HTML コードやテキストを含むすべてのコンテンツを取得します。

vueで要素の内容を取得する方法

Vue で要素のコンテンツを取得する方法

Vue では、要素のコンテンツを取得する方法がいくつかあります。

.textContent

.textContent プロパティは、改行やテキスト ノードを含む、要素に含まれるすべてのテキスト コンテンツを取得します。

<code><template>
  <div id="my-element">
    Hello, world!
    <br>
    This is some text.
  </div>
</template>

<script>
  export default {
    mounted() {
      const element = this.$refs.myElement;
      console.log(element.textContent); // 输出:Hello, world!
                                          // This is some text.
    }
  }
</script></code>
ログイン後にコピー

.innerText

.innerText このプロパティは、改行とテキスト ノードを除く、要素内の表示テキスト コンテンツを取得します。

<code><template>
  <div id="my-element">
    Hello, world!
    <br>
    This is some text.
  </div>
</template>

<script>
  export default {
    mounted() {
      const element = this.$refs.myElement;
      console.log(element.innerText); // 输出:Hello, world! This is some text.
    }
  }
</script></code>
ログイン後にコピー

.innerHTML

.innerHTML プロパティは、HTML コードやテキストを含む要素内のすべてのコンテンツを取得します。

rree

以上がvueで要素の内容を取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
vue
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート