Phương thức innerHTML Jquery html() thiết lập (set) hoặc trả về (return) nội dung (innerHTML) của các phần tử đã chọn. Khi phương thức này được sử dụng để trả về
nội dung, nó sẽ trả về nội dung của phần tử được so khớp ĐẦU TIÊN. Khi phương thức này được sử dụng để thiết lập nội dung, nó sẽ ghi đè lên nội dung của TẤT CẢ các phần tử phù hợp. Mẹo: Để đặt hoặc chỉ trả về nội dung văn bản của các phần tử đã chọn, hãy sử dụng phương thức text().
Cú pháp: – Trả về nội dung: $(selector).html() – Thiết lập nội dung: $(selector).html(content) – Thiết lập nội dung với funciton: $(selector).html(function(index, currentcontent)) Ví dụ:
Hướng dẫn về jQuery innerHTML. Ở đây chúng ta thảo luận về phần giới thiệu jQuery innerHTML cùng với các ví dụ lập trình để hiểu rõ hơn ..
Bạn đang xem: lấy
jquery html bên trong
Giới thiệu về jQuery innerHTML
Thuộc tính innerHTML của giao diện người dùng jQuery được sử dụng để đặt hoặc lấy nội dung HTML hoặc HTML bên trong của một phần tử. Giao diện người dùng jQuery bên trongHTML là một thuộc tính hoặc thuộc tính được tích hợp sẵn trong thư viện giao diện
người dùng jQuery. Thuộc tính innerHTML của jQuery UI cho phép viết một html động trên tài liệu html. Hầu hết nó được sử dụng để tạo liên kết, biểu mẫu nhận xét, biểu mẫu đăng ký, v.v. Tất cả các phần tử HTML đều có thuộc tính innerHTML. Phương thức jQuery .html () có thể được sử dụng để truy xuất nội dung HTML của phần tử đầu tiên trong tập hợp các phần tử đã so khớp. Lưu ý rằng jQuery innerHTML không thoát ra dưới dạng một phương thức, chúng tôi sử dụng phương thức, html () để đặt hoặc lấy nội
dung HTML.
Cú pháp của thuộc tính jQuery UI innerHTML:
Bắt đầu khóa học phát triển phần mềm miễn phí của bạn
Phát triển web, ngôn ngữ lập trình, Kiểm tra phần mềm & amp; những người khác
Có hai cú pháp của thuộc tính jQuery UI innerHTML dựa trên mục đích sử dụng:
HTMLelementObj.innerHTML
Nó được sử dụng để trả về thuộc tính innerHTML. Giá trị trả về của thuộc tính này là String, đại diện cho nội dung HTML của một phần tử.
HTMLelementObj.innerHTML = text
Nó được sử dụng để đặt thuộc tính innerHTML. Văn bản đại diện cho nội dung HTML của một phần tử.
Ví dụ về jQuery innerHTML
Dưới đây là các ví dụ được đề cập:
Ví dụ # 1
Thuộc tính innerHTML được sử dụng để đặt nội dung của các phần tử html.
Mã:
& lt;! doctype html & gt;
& lt; html lang = "vi" & gt;
& lt; đầu & gt;
& lt; meta charset = "utf-8" & gt;
& lt; title & gt; Đây là ví dụ cho thuộc tính innerHTML của jQuery UI & lt; / title & gt;
& lt; / head & gt;
& lt; body & gt;
& lt; p id = "p" & gt; Đây là nội dung cũ cho một phần tử của id p. & lt; / p & gt;
& lt; p id = "p" & gt; Đây là nội dung cũ cho một phần tử của id p. & lt; / p & gt;
& lt; div id = "div" & gt; Đây là nội dung cũ cho một phần tử của id div. & lt; / div & gt;
& lt; script & gt;
document.getElementById ("p"). innerHTML = "Đây là nội dung mới cho một phần tử của id p.";
document.getElementById ("div"). innerHTML = "Đây là nội dung mới cho một phần tử của id div.";
& lt; / script & gt;
& lt; / body & gt;
& lt; / html & gt;
Đầu ra:
Như trong chương trình trên, các phần tử html p và div được xác định với một số nội dung và sau đó những nội dung đó được đặt hoặc thay thế bởi một số nội dung khác thông qua thuộc tính innerHTML bằng cách sử dụng id của các phần tử html. Nếu chúng ta thấy trong đầu ra ở trên chỉ có phần tử p đầu tiên được đặt bởi nội dung
mới trong khi nội dung phần tử p thứ hai vẫn không thay đổi. Vì vậy, innerHTML đặt nội dung của phần tử đầu tiên của tập hợp các phần tử được so khớp.
Ví dụ # 2
Thuộc tính innerHTML được sử dụng để lấy nội dung của các phần tử html.
Mã:
& lt;! doctype html & gt;
& lt; html lang = "vi" & gt;
& lt; đầu & gt;
& lt; meta charset = "utf-8" & gt;
& lt; title & gt; Đây là ví dụ cho thuộc tính innerHTML của jQuery UI & lt; / title & gt;
& lt; / head & gt;
& lt; body & gt;
& lt; p id = "p" & gt; Đây là nội dung đầu tiên cho phần tử p. & lt; / p & gt;
& lt; p id = "p" & gt; Đây là nội dung thứ hai cho phần tử p. & lt; / p & gt;
& lt; div id = "div" & gt; Đây là nội dung cho phần tử div. & lt; / div & gt;
& lt; nút onclick = "getpcontent ()" & gt; lấy nội dung phần tử p & lt; / button & gt;
& lt; nút onclick = "getdivcontent ()" & gt; nhận nội dung phần tử div & lt; / button & gt;
& lt; p id = "d1" & gt; & lt; / p & gt;
& lt; script & gt;
hàm getpcontent () {
var d = document.getElementById ("p"). innerHTML;
document.getElementById ("d1"). innerHTML = d;
}
hàm getdivcontent () {
var d = document.getElementById ("div"). innerHTML;
document.getElementById ("d1"). innerHTML = d;
}
& lt; / script & gt;
& lt; / body & gt;
& lt; / html & gt;
Đầu ra:
Khi chúng tôi nhấp vào nút “nhận nội dung phần tử p”, kết quả đầu ra:
Và khi chúng tôi nhấp vào nút “nhận nội dung phần tử div”, kết quả:
Như trong chương trình trên, các phần tử html p và div được xác định với một số nội dung và những nội dung đó chúng ta nhận được thông qua thuộc tính innerHTML bằng cách sử dụng id của các phần tử html. Nếu chúng ta thấy trong kết quả trên chỉ có nội dung phần tử p đầu tiên được hiển thị. Vì vậy, thuộc tính innerHTML lấy nội dung của phần tử đầu tiên trong tập hợp các phần tử đã so khớp.
Ví dụ # 3
Thuộc tính innerHTML được sử dụng để tạo biểu mẫu html bằng cách
nhấp vào nút trên trang web.
Mã:
& lt;! doctype html & gt;
& lt; html lang = "vi" & gt;
& lt; đầu & gt;
& lt; meta charset = "utf-8" & gt;
& lt; title & gt; Đây là ví dụ cho thuộc tính innerHTML của jQuery UI & lt; / title & gt;
& lt; / head & gt;
& lt; body & gt;
& lt; p & gt; Nhấp vào bên dưới để đưa ra bất kỳ khiếu nại nào. & lt; / p & gt;
& lt; form name = "form" & gt;
& lt; input type = "button" value = "Nhận biểu mẫu khiếu nại" onclick = "showform ()" & gt;
& lt; p id = "d1" & gt; & lt; / p & gt;
& lt; / form & gt;
& lt; script & gt;
function showform () {
var d = "Tên: & lt; input type = 'text' name = 'name' & gt; & lt; br & gt; Khiếu nại: & lt; br & gt; & lt; textarea rows = '5' cols = '80' & gt; & lt; / textarea & gt ; & lt; br & gt; & lt; input type = 'submit' value = 'Đăng Khiếu nại' & gt; ";
document.getElementById ('d1'). innerHTML = d;
}
& lt; / script & gt;
& lt; / body & gt;
& lt; / html & gt;
Đầu ra:
Khi chúng tôi nhấp vào nút “Nhận biểu mẫu khiếu nại”, biểu mẫu sẽ được tạo động như trong kết quả bên dưới:
Như trong chương trình trên, biểu mẫu đang tạo động bên trong phần tử p có id d1 bằng cách nhấp vào nút “Nhận biểu mẫu khiếu nại” gọi hàm showform (), trong đó bên trong hàm này, biểu mẫu đang tạo và sau đó thiết lập biểu mẫu này dưới dạng nội dung của phần tử p thông qua thuộc tính innerHTML bằng cách sử dụng id của
phần tử html p.
Kết luận
Thuộc tính jQuery UI innerHTML là thuộc tính được tích hợp sẵn trong thư viện jQuery UI, được sử dụng để đặt hoặc lấy nội dung HTML hoặc (HTML bên trong) của một phần tử. Nó cho phép viết một html động trên tài liệu html như liên kết động, nhận xét động, biểu mẫu động, v.v. Thuộc tính jQuery UI innerHTML được sử dụng với phương thức document.getElementById ().
Các bài báo được đề xuất
Đây là hướng dẫn về jQuery innerHTML. Ở đây chúng
ta thảo luận về việc giới thiệu jQuery innerHTML cùng với các ví dụ lập trình. Bạn cũng có thể xem các bài viết sau để tìm hiểu thêm –
0
Chia sẻ
Xem thêm những thông tin liên quan đến chủ đề lấy jquery html bên trong
jQuery Rehab – Inserting HTML – Episode 8
Tác
giả: Steve Griffith – Prof3ssorSt3v3
Ngày đăng: 2019-05-16
Đánh giá: 4 ⭐ ( 8581 lượt đánh giá )
Khớp với kết quả tìm kiếm: This episode covers how you can insert new HTML into your webpage without relying on the jQuery methods.
Làm cách nào để lấy thẻ HTML
bằng JavaScript / jQuery?
Tác giả: qastack.vn
Đánh giá: 5 ⭐ ( 3224 lượt đánh giá )
Khớp với kết quả tìm kiếm: [Tìm thấy giải pháp!] Cách đơn giản nhất để có được htmlphần tử nguyên bản là: document.documentElement Đây là tài…
Các hàm thường dùng trong jquery
Tác giả: longnv.name.vn
Đánh giá: 5 ⭐ ( 5724 lượt đánh
giá )
Khớp với kết quả tìm kiếm:
Phương thức html() trong jQuery
Tác giả: webcoban.vn
Đánh giá: 3 ⭐ ( 9293 lượt đánh giá )
Khớp với kết quả tìm kiếm: Cách sử dụng phương thức html() trong jQuery để lấy toàn bộ nội dung bên trong phần tử được chọn hoặc dùng để thiết lập lại nội dung bên trong phần tử được chọn
Hàm
html() và text() trong jquery
Tác giả: toidicode.com
Đánh giá: 3 ⭐ ( 6989 lượt đánh giá )
Khớp với kết quả tìm kiếm: -Hàm này có tác dụng lấy nội dung HTML, hoặc gán nội dung HTML vào một thành phần. Hàm này có tác dụng như thuộc tính innerHTML trong javascript.
Sử dụng cú pháp trong jquery
Tác
giả: levunguyen.com
Đánh giá: 4 ⭐ ( 1958 lượt đánh giá )
Khớp với kết quả tìm kiếm: Sử dụng cú pháp Jquery và các selector được sử dụng trong Jquery để dự án làm web. Hướng dẫn Sử dụng selector trong jquery vào dự án web.
jQuery Attributes
Tác giả: freetuts.net
Đánh giá: 3 ⭐ ( 5957 lượt đánh giá )
Khớp với kết quả
tìm kiếm: tìm hiểu hàm html() trong jquery, cách sử dụng hàm html() để lấy nội dung của một thẻ html bất kỳ, hoặc là sử dụng hàm html() jquery để thiết lập nội dung.
Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình
