Home > Developer > Web Develop
. HTML (),. Text (),. Val () Three methods are used to read the contents of the selected element; HTML () is used to read the HTML content of the element (including its HTML tags),. Text () is used to read the plain text content of the element, including its descendant elements,. Val () Is the "value" value that is used to read form elements. The. and. Text () methods cannot be used on form elements, whereas. val () can only be used on form elements; the. html () method only reads the first element when used on more than one element, and the. Val () method is the same as. html () If it is applied on more than one element. Only the value of the first FORM element can be read, but. Text () is different from theirs, and if. Text () is applied on more than one element, the textual content of all the selected elements is read.
. HTML (htmlstring),. Text (TextString), and. Val (value) Three methods are used to replace the contents of the selected element, and if three methods are applied on more than one element at the same time, the contents of all the selected elements will be replaced.
The Val ()---is generally used on input instead of other elements to get the value of input or select
HTML () and text () can be used on a variety of elements, but HTML () is equivalent to the return of the source code, that is, the returned content will contain a variety of tags, and text () is the equivalent of the page display is returned, the content returned is out of the various tags between the content There are two methods in the HTML attribute, one with a parameter and one without a parameter.
No parameter is used to obtain the content, for example, as follows:
1<! DOCTYPE html>234<script src= "Http://libs.baidu.com/jquery/1.10.2/jquery.min.js" >5</script>6<script>7$ (document). Ready (function(){8$ ("#btn1"). Click (function(){9Alert ("Text:" + $ ("#test"). text ());Ten }); One$ ("#btn2"). Click (function(){ AAlert ("HTML:" + $ ("#test"). HTML ()); - }); - }); the</script> - - -<body> +<p id= "Test" >this is some <b>bold</b> text in a paragraph.</p> -<button id= "BTN1" >show text</button> +<button id= "BTN2" >show html</button> A</body> atThe results of the operation are as follows:
1. Click Showtext
2. Click showhtml
Replace the contents of the selected element when there is a parameter:
1 <!DOCTYPE HTML>2 <HTML>3 <Head>4 <Scriptsrc= "Http://libs.baidu.com/jquery/1.10.2/jquery.min.js">5 </Script>6 <Script>7 $ (document). Ready (function(){8 $("#btn1"). Click (function(){9 $("#test1"). Text ("Hello world!");Ten }); One $("#btn2"). Click (function(){ A $("#test2"). HTML ("<b>hello world!</b>"); - }); - $("#btn3"). Click (function(){ the $("#test3"). Val ("Dolly Duck"); - }); - }); - </Script> + </Head> - + <Body> A <PID= "Test1">This is a paragraph.</P> at <PID= "Test2">This is another paragraph.</P> - <P>Input field:<inputtype= "text"ID= "Test3"value= "Mickey Mouse"></P> - <ButtonID= "BTN1">Set Text</Button> - <ButtonID= "BTN2">Set HTML</Button> - <ButtonID= "Btn3">Set Value</Button> - </Body> in </HTML> Before clicking, the following:
Click Set Text:
Click Set Value:
Click Set HTML:
The difference and use of HTML (), text (), Val () in jquery
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
