jQuery

来源：互联网发布：淘宝申请天猫客服介入编辑：程序博客网时间：2024/06/06 02:19

text()：获取匹配元素集合中每个元素的组合文本内容，包括其后代。

<!doctype html><html lang="en"><head>  <meta charset="utf-8">  <title>text demo</title>  <style>  p {    color: blue;    margin: 8px;  }  b {    color: red;  }  </style>  <script src="https://code.jquery.com/jquery-1.10.2.js"></script></head><body><p><b>Test</b> Paragraph.</p><p></p><script>var str = $( "p:first" ).text();$( "p:last" ).html( str );</script></body></html>

html()：获取匹配元素集合中第一个元素的HTML内容。

<!doctype html><html lang="en"><head>  <meta charset="utf-8">  <title>html demo</title>  <style>  p {    margin: 8px;    font-size: 20px;    color: blue;    cursor: pointer;  }  b {    text-decoration: underline;  }  button {    cursor: pointer;  }  </style>  <script src="https://code.jquery.com/jquery-1.10.2.js"></script></head><body><p>  <b>Click</b> to change the <span id="tag">html</span></p><p>  to a <span id="text">text</span> node.</p><p>  This <button name="nada">button</button> does nothing.</p><script>$( "p" ).click(function() {  var htmlString = $( this ).html();  $( this ).text( htmlString );});</script></body></html>

Val()：获取匹配元素集合中第一个元素的当前值。

<!doctype html><html lang="en"><head>  <meta charset="utf-8">  <title>val demo</title>  <style>  p {    color: red;    margin: 4px;  }  b {    color: blue;  }  </style>  <script src="https://code.jquery.com/jquery-1.10.2.js"></script></head><body><p></p><select id="single">  <option>Single</option>  <option>Single2</option></select><select id="multiple" multiple="multiple">  <option selected="selected">Multiple</option>  <option>Multiple2</option>  <option selected="selected">Multiple3</option></select><script>function displayVals() {  var singleValues = $( "#single" ).val();  var multipleValues = $( "#multiple" ).val() || [];  // When using jQuery 3:  // var multipleValues = $( "#multiple" ).val();  $( "p" ).html( "<b>Single:</b> " + singleValues +    " <b>Multiple:</b> " + multipleValues.join( ", " ) );}$( "select" ).change( displayVals );displayVals();</script></body></html>

<!doctype html><html lang="en"><head>  <meta charset="utf-8">  <title>val demo</title>  <style>  p {    color: blue;    margin: 8px;  }  </style>  <script src="https://code.jquery.com/jquery-1.10.2.js"></script></head><body><input type="text" value="some text"><p></p><script>$( "input" )  .keyup(function() {    var value = $( this ).val();    $( "p" ).text( value );  })  .keyup();</script></body></html>

阅读全文

0 0