Computer >> Máy Tính >  >> Lập trình >> HTML

Đối tượng trích dẫn DOM HTML

Đối tượng trích dẫn DOM HTML được liên kết với phần tử HTML . Phần tử được sử dụng để tham chiếu đến tác phẩm sáng tạo được trích dẫn và tiêu đề phải được bao gồm. Nó có thể là tranh, sách, chương trình truyền hình, phim, v.v.

Cú pháp

Sau đây là cú pháp cho -

Tạo đối tượng trích dẫn -

var x = document.createElement("CITE");

Ví dụ

Hãy để chúng tôi xem một ví dụ về đối tượng trích dẫn DOM HTML -

<!DOCTYPE html>
<html>
<body>
<p>Click the below button to create a CITE element.</p>
<button onclick="createCite()">CREATE</button><br><br>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Van_Gogh_-
_Starry_Night_-_Google_Art_Project.jpg/800px-Van_Gogh_-_Starry_Night_-
_Google_Art_Project.jpg" width="220" height="277" alt="The Starry night">
<script>
   function createCite() {
      var x = document.createElement("CITE");
      var t = document.createTextNode("The Starry night.");
      x.appendChild(t);
      document.body.appendChild(x);
   }
</script>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Đối tượng trích dẫn DOM HTML

Nhấp vào “TẠO” -

Đối tượng trích dẫn DOM HTML

Trong ví dụ trên, chúng tôi đã chèn một hình ảnh bằng thẻ -

<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Van_Gogh_-_Starry_Night_-_Google_Art_Project.jpg/800px-Van_Gogh_-_Starry_Night_-_Google_Art_Project.jpg" width="220" height="277" alt="The Starry night">

Sau đó, chúng tôi đã tạo một nút CREATE để thực thi phương thức createCite () -

<button onclick="createCite()">CREATE</button>

Phương thức createCite () tạo một phần tử và gán nó cho biến x. Một nút văn bản chứa một số văn bản được tạo và gán cho biến t. Sau đó, nút văn bản được nối vào phần tử bằng phương thức appendChild () trên biến x. Sau đó, phần tử cùng với nút văn bản được nối vào phần thân tài liệu bằng phương thức appendChild () trên phần thân tài liệu.