Chủ đề của PRN232 - Xây dựng ứng dụng back-end đa nền tảng với .NET

PRN232 Chương 7 - JavaScript Client và AJAX gọi Web API

Chương 7 môn PRN232 hướng dẫn phía client gọi Web API: cú pháp nền tảng $(selector).action() của jQuery và các bộ chọn phần tử, gửi request bất đồng bộ bằng $.ajax, $.get và $.post, ưu thế của phương thức .on() nhờ event delegation gắn được cả phần tử chưa tồn tại trong DOM, ý nghĩa chữ asynchronous giúp trình duyệt không bị treo, Same-Origin Policy chặn request khác domain, cùng cách nhận biết JSON hợp lệ và tài liệu XML well-formed. Trọn bộ câu hỏi trắc nghiệm có giải thích.

Xem danh sách câu hỏi11 câu hỏi100% có giải thích

Bắt đầu bằng Chế độ học nếu bạn muốn đáp án và giải thích hiện ngay sau mỗi câu — không bấm giờ, dừng lúc nào cũng được. Chọn Thi thử khi muốn biết mình đang ở đâu: có bấm giờ, chấm điểm ở cuối, và giải thích chỉ mở sau khi nộp.

Học ngân hàng câu hỏi của chủ đề

Luyện tập theo chủ đề này

11Câu hỏi hiện có

Số câu hỏi

Lấy từ 11 câu của môn

Độ khó

Gồm cả những câu chưa được chấm độ khó

Đảo vị trí đáp ánMỗi câu một thứ tự riêng, mỗi lượt làm lại một khác. Thứ tự câu hỏi giữ nguyên.

Phiên sắp tạo

11 câu Chế độ học Không giới hạn Mọi mức

Bắt đầu ngay, không cần tài khoản. Làm vài câu đầu rồi để lưu bài và làm tiếp.

Câu hỏi của chủ đề

11/11 câuHết danh sách

1Consider this code: $("#myButton").on("click", function(event) { ... });. What is the event parameter?4 lựa chọn

AA string representing the name of the event ("click").

BThe HTML element that was clicked.

CAn object containing information about the event, such as the mouse position and the target element.

DA boolean value indicating if the click was successful.

Lời giải

Khi chúng ta sử dụng hàm on() để thêm một sự kiện vào một phần tử HTML, chúng ta có thể nhận được một đối tượng chứa thông tin về sự kiện đó. Đối tượng này bao gồm nhiều thuộc tính như vị trí của chuột, phần tử mục tiêu, thời điểm xảy ra sự kiện, v.v. Trong ví dụ trên, đối tượng event sẽ chứa thông tin về sự kiện click, bao gồm vị trí của chuột, phần tử mục tiêu, thời điểm xảy ra sự kiện, v.v. Do đó, đối tượng event không phải là một chuỗi biểu diễn tên sự kiện, cũng không phải là phần tử HTML được click, cũng không phải là một giá trị boolean chỉ ra sự thành công của sự kiện.

Mở trang câu hỏi này →

2How would you select all <p> elements that are descendants of a <div> element?4 lựa chọnKhó33% trả lời đúng

A$("div > p")

B$("div p")

C$("div + p")

D$("div ~ p")

Lời giải

Để chọn tất cả các phần tử <p> là con của một phần tử <div>, chúng ta sử dụng biểu thức chọn CSS. Biểu thức chọn CSS là một chuỗi ký tự được sử dụng để chọn các phần tử HTML dựa trên các thuộc tính và vị trí của chúng trong trang web. Trong trường hợp này, chúng ta muốn chọn tất cả các phần tử <p> nằm trong phần tử <div>, không quan tâm đến độ sâu của phần tử <p> so với phần tử <div>. Biểu thức chọn CSS phù hợp cho trường hợp này là "div p", vì nó chọn tất cả các phần tử <p> nằm trong phần tử <div> hoặc là con của phần tử <div>.

Mở trang câu hỏi này →

3In jQuery, what is the primary advantage of using the .on() method for event handling?4 lựa chọn

AIt is shorter to type than .click().

BIt can attach event handlers to elements that do not yet exist in the DOM (event delegation).

CIt only works for mouse-related events.

DIt prevents the default action of the event automatically.

Lời giải

Khi sử dụng phương thức .on() trong jQuery, lợi thế chính là khả năng gắn các xử lý sự kiện vào các phần tử chưa tồn tại trong DOM (đại diện sự kiện). Điều này cho phép bạn gắn các xử lý sự kiện vào các phần tử sẽ được tạo sau này trong quá trình chạy chương trình. Ví dụ, bạn có thể gắn một xử lý sự kiện click vào các phần tử có class 'button' mà không cần phải biết trước số lượng phần tử sẽ được tạo. Phương thức .on() cũng cho phép bạn gắn các xử lý sự kiện vào các phần tử cha hoặc mẹ của phần tử đích, giúp giảm thiểu số lượng xử lý sự kiện cần gắn.

Mở trang câu hỏi này →

4In jQuery, which method is typically used to send AJAX requests?4 lựa chọn

A$.get()

B$.post()

C$.ajax()

DAll of the above

Lời giải

Trong jQuery, phương thức thường được sử dụng để gửi yêu cầu AJAX là $.get(), $.post() và $.ajax(). Phương thức $.get() được sử dụng để gửi yêu cầu GET, trong khi $.post() được sử dụng để gửi yêu cầu POST. Phương thức $.ajax() là một phương thức chung hơn, cho phép bạn gửi các loại yêu cầu khác nhau, bao gồm cả GET và POST. Vì vậy, câu trả lời đúng là tất cả các phương thức trên.

Mở trang câu hỏi này →

5What does the "asynchronous" in AJAX mean?4 lựa chọn

AThe code is guaranteed to execute in a specific, synchronous order.

BThe web browser can continue to be responsive to the user while waiting for the server to send back a response.

CThe server must respond to the request immediately.

DThe data must be in XML format.

Lời giải

AJAX là một kỹ thuật cho phép thực hiện các yêu cầu với máy chủ mà không cần phải tải lại toàn bộ trang web. Khi nói đến khái niệm 'asynchronous', điều đó có nghĩa là trình duyệt web có thể tiếp tục phản hồi với người dùng trong khi chờ đợi máy chủ gửi lại phản hồi. Điều này cho phép người dùng tương tác với trang web mà không cần phải chờ đợi phản hồi từ máy chủ. Ví dụ, khi bạn nhấp vào một nút, trình duyệt web có thể tiếp tục phản hồi với người dùng ngay lập tức, ngay cả khi máy chủ vẫn đang xử lý yêu cầu. Điều này giúp cải thiện trải nghiệm người dùng và tăng tốc độ tải trang.

Mở trang câu hỏi này →

6What is the fundamental syntax for selecting an HTML element and applying an action in jQuery?4 lựa chọnDễ100% trả lời đúng

Aelement.action()

B$(selector).action()

CjQuery(action).selector()

Dselect(element).do(action)

Lời giải

Để chọn một phần tử HTML và áp dụng một hành động trong jQuery, bạn cần sử dụng cú pháp cơ bản. Cú pháp này bao gồm việc sử dụng ký hiệu '$' để chỉ định jQuery, sau đó là chọn phần tử bằng cách sử dụng 'selector', và cuối cùng là áp dụng hành động bằng cách sử dụng phương thức 'action'. Ví dụ, nếu bạn muốn chọn phần tử có id là 'myId' và thêm một lớp CSS 'active', bạn sẽ sử dụng cú pháp '$('#myId').addClass('active')'. Cú pháp này cho phép bạn chọn phần tử và áp dụng hành động một cách linh hoạt và hiệu quả.

Mở trang câu hỏi này →

7What is the Same-Origin Policy in the context of AJAX?4 lựa chọn

AA policy that states all variables in a script must be of the same type.

BA security measure that prevents a web page from making AJAX requests to a different domain than the one it originated from.

CA rule that requires all AJAX requests to return JSON.

DA policy that ensures all developers on a team use the same coding style.

Lời giải

Chính sách Same-Origin Policy là một biện pháp bảo mật được áp dụng trong ngữ cảnh AJAX. Nó ngăn chặn trang web từ thực hiện yêu cầu AJAX đến một miền khác với miền mà trang web được tạo ra. Điều này giúp ngăn chặn các cuộc tấn công độc hại như tấn công XSS (Cross-Site Scripting) và tấn công CSRF (Cross-Site Request Forgery). Khi một trang web thực hiện yêu cầu AJAX đến một miền khác, trình duyệt sẽ tự động chặn yêu cầu này để bảo vệ người dùng khỏi các cuộc tấn công độc hại. Chính sách này giúp đảm bảo an toàn cho người dùng và ngăn chặn các cuộc tấn công độc hại.

Mở trang câu hỏi này →

8Which data types are supported in JSON?4 lựa chọn

AString, Number, Boolean, Array, Object, null

BString, Integer, Float, Date, Array, Hashtable

CText, Decimal, Bit, List, Dictionary, null

DVarchar, Number, Boolean, Collection, Object, undefined

Lời giải

JSON hỗ trợ nhiều loại dữ liệu khác nhau. Trong đó có String, Number, Boolean, Array và Object. String được sử dụng để lưu trữ chuỗi ký tự, Number để lưu trữ số nguyên và số thực, Boolean để lưu trữ giá trị logic True hoặc False, Array để lưu trữ danh sách các giá trị và Object để lưu trữ các thuộc tính và giá trị. null được sử dụng để biểu thị giá trị không có. JSON không hỗ trợ các loại dữ liệu như Integer, Float, Date, Text, Decimal, Bit, List, Dictionary, Varchar, Number, Boolean, Collection, Object, undefined vì chúng không phải là các loại dữ liệu cơ bản trong JSON.

Mở trang câu hỏi này →

9Which of the following is a valid JSON object?4 lựa chọnDễ75% trả lời đúng

A{ 'name': 'John Doe', "age": 30 }

B{ name: "John Doe", age: 30 }

C{ "name": "John Doe", "age": 30, }

D{ "name": "John Doe", "age": 30 }

Lời giải

Một đối tượng JSON hợp lệ phải tuân thủ các quy tắc sau: - Các khóa phải được bao quanh bởi dấu ngoặc kép (" "). - Các giá trị phải được bao quanh bởi dấu ngoặc kép (" ") nếu là chuỗi, hoặc không cần dấu ngoặc kép nếu là số hoặc giá trị boolean. - Không được bỏ dấu phẩy sau mỗi cặp khóa-giá trị. - Không được bỏ dấu ngoặc kép ở cuối đối tượng. Vì vậy, trong bốn lựa chọn trên, chỉ có "{ "name": "John Doe", "age": 30 }" đáp ứng được các quy tắc này.

Mở trang câu hỏi này →

10Which of the following is a well-formed XML document?4 lựa chọnDễ100% trả lời đúng

A<note> <to>Tove</to> <from>Jani</from> </note>

B<note> <to>Tove <from>Jani</from> </to> </note>

C<note> <to>Tove</to> <from>Jani <note>

D<note> <to>Tove</from><from>Jani</to> </note>

Lời giải

Một tài liệu XML được coi là hợp lệ nếu nó tuân theo các quy tắc về cấu trúc và ngữ nghĩa của XML. Trong các lựa chọn trên, tài liệu XML hợp lệ phải có các phần tử được đóng mở đúng cách và các phần tử con phải được đóng gói trong phần tử cha. Ví dụ, trong tài liệu XML « <note> <to>Tove</to> <from>Jani</from> </note> », phần tử «note» được mở và đóng đúng cách, và các phần tử «to» và «from» được đóng gói trong phần tử «note». Ngược lại, trong tài liệu XML « <note> <to>Tove <from>Jani</from> </to> </note> », phần tử «to» không được đóng đúng cách vì nó không có phần tử đóng. Trong tài liệu XML « <note> <to>Tove</to> <from>Jani <note>», phần tử «from» không được đóng đúng cách vì nó không có phần tử đóng. Cuối cùng, trong tài liệu XML « <note> <to>Tove</from><from>Jani</to> </note> », các phần tử «to» và «from» không được đóng gói trong phần tử «note». Vì vậy, chỉ có tài liệu XML « <note> <to>Tove</to> <from>Jani</from> </note> » là hợp lệ.

Mở trang câu hỏi này →

11You want to select all <a> tags that have a target attribute equal to _blank. What is the correct selector?4 lựa chọn

A$("a[target='_blank']")

B$("a.target._blank")

C$("a where target is _blank")

D$("a{target:'_blank'}")

Lời giải

Để chọn tất cả các thẻ <a> có thuộc tính target bằng '_blank', bạn cần sử dụng selector đúng. Selector là một phần của CSS hoặc jQuery dùng để chọn phần tử HTML. Trong trường hợp này, bạn cần sử dụng selector có dạng 'a[target='_blank']'. Điều này sẽ chọn tất cả các thẻ <a> có thuộc tính target bằng '_blank'.

Mở trang câu hỏi này →