Three kinds of reading the contents of the selected element method

Read, modify text or HTML structure element is a common element of DOM operations, jQuery provides two convenient method for such treatment: .html () and .text (). HTML () method is to obtain a match in the first set of HTML content element or a matching element disposed for each HTML content, particularly three ways:

  1. HTML () value is not passed, it is to obtain a match in the first set of HTML content element;
  2. html (htmlString) matching element disposed HTML content;
  3. html (function (index, oldhtml) ) is used to return a function of HTML content provided.
    Note that the .html () internal method using the DOM innerHTML property to handle, so the set and get on to note that the most important issue: This operation is for the entire HTML content.
    Here Insert Picture Description
    Html method shows the contents acquired; .html () is the entire structure of an html document.
    text () method:
    text () method to obtain each element in the set of matched elements incorporated in the text, including text content of each element of their offspring, or matching elements provided in the contents of the specified polymerization. In particular there are three ways:
  4. text () were combined to give the text of each element of the set of matched elements, including their progeny;
  5. text (textString) for matching the text content of the element;
  6. text (function (index, text) ) is used to return a function of the content of the text.
    Note that the result of text () method returns a string that contains the text merging all matching elements.
    Here Insert Picture Description
    It shows the contents of the acquired text method; .text () is a collection of text.
    Similarities and Differences html () and text (): The
    method of operation is the same as html and .text, except for the processing target only specific; html () method of treatment is the element content, text () method is processed text. html () method can only be used in an HTML document, text () method can be used in XML and HTML.
    If the object is processed only one child text node, then the results with the results of html text processing method for processing method is the same. There is a special case, is not supported by Firefox innerText property, used a similar textContent property, .text () method combines the support of two properties, it is compatible with all browsers.
    jQuery there is a method of acquiring a set of matched elements of the first element, which is Val () method; however Val () method is mainly used to form elements of the process value, such as input, select, textarea. Specific also three ways:
  7. Val () method without parameters, retrieves the current value of the first element of the set of matched elements;
  8. val (value), the collection element disposed in the match value of each element;
  9. val (function), a function to set the return value.
    Note that the value of the select element through a method of treating .val (), when no selection item is selected it returns null, .val () methods are used to set fields in the form. If the select element has Multiple (multiple choice) property, and at least one selection item is selected, then the .val () method returns an array that contains each of the selected option values.
    Here Insert Picture Description
    .html () ,. differences in the three methods of text () and .val () Summary:
    First .html () ,. text () and .val () three methods are used to read the contents of the selected element ; and is used to read only .html html content element (including html tags) ,. text () is used to read plain text elements, including its descendant elements, Val () is used to read the form element the "value" value.
    Wherein .html () and .text () can not be used on the form element, .val () can only be used on the form element; Further, .html () method on a plurality of elements, only one element is read; .val () and .html () the same, if applied to multiple elements of a form has only read the first element of "value" value, but .text () and they are not the same, if. Text ( ) when applied to multiple elements, it will read the text content of all elements.
    Second, three methods .html (htmlString) ,. text (textString ), and .val (value) are used to replace the contents of the selected element, if the use of these three methods simultaneously on multiple elements, it will replace check out the contents of all the elements.
    Finally .html () ,. text () and .val () can use callback function's return value to dynamically change the content of the elements.

Guess you like

Origin blog.csdn.net/weixin_44560796/article/details/91353640