[vanilla JS] getting the elements
4658 ワード
要素のインポート
1. document.getElementById(「id名」)
-->idを使用してelement(要素)をインポートできます.
💻EX
HTML)
...
<body>
<h1 class = "hello" id = "title"></h1>
<script src = app.js></script>
</body>
...
JS)
const title = document.getElementById("title")
title.innerText = "Got ya!"
console.log(title.id)
console.log(title.className)
--> (콘솔창)
title
hello
2. document.getElementsByClassName(「クラス名」)、document。getElementsByTagName(「tag」名)
-->
I)class/tagを使用して要素をインポートできます
Ⅱ)配列値を返す.
III)多くの要素をロードする必要がある場合に使用する.
💻EX
document.getElementsByClassName("class" 이름)
document.getElementsByTagName("tag" 이름)
3. document.querySelector("CSS selector")
-->要素はcssで検索できます.
💻EX
const title = document.querySelector(".hello h1")
console.log(title)
+ document.querySelectorAll()
: 모든 자식 요소를 가져다준다 (배열의 형태로)
Reference
この問題について([vanilla JS] getting the elements), 我々は、より多くの情報をここで見つけました https://velog.io/@marvey-qween/vanilla-JS-getting-the-elementsテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol