天天看點

jQuery HTML 操作 改變/添加文本值

1、JQuery 改變p中的文本值

<code>&lt;</code><code>html</code><code>&gt;</code>

<code>&lt;</code><code>head</code><code>&gt;</code>

<code>&lt;</code><code>script</code> <code>type="text/javascript" src="jquery-1.7.1.min.js"&gt;&lt;/</code><code>script</code><code>&gt;</code>

<code>&lt;</code><code>script</code> <code>type="text/javascript"&gt;</code>

<code>$(document).ready(function(){</code>

<code>  </code><code>$("button").click(function(){</code>

<code>  </code><code>$("p").html("Update text");</code>

<code>  </code><code>});</code>

<code>});</code>

<code>&lt;/</code><code>script</code><code>&gt;</code>

<code>&lt;/</code><code>head</code><code>&gt;</code>

<code>&lt;</code><code>body</code><code>&gt;</code>

<code>&lt;</code><code>h2</code><code>&gt;This is a heading&lt;/</code><code>h2</code><code>&gt;</code>

<code>&lt;</code><code>p</code><code>&gt;This is a paragraph.&lt;/</code><code>p</code><code>&gt;</code>

<code>&lt;</code><code>p</code><code>&gt;This is another paragraph.&lt;/</code><code>p</code><code>&gt;</code>

<code>&lt;</code><code>button</code> <code>type="button"&gt;Click here&lt;/</code><code>button</code><code>&gt;</code>

<code>&lt;/</code><code>body</code><code>&gt;</code>

<code>&lt;/</code><code>html</code><code>&gt;</code>

 2、JQuery 添加p中的文本值

<code>  </code><code>$("p").append(" Append text");</code>

<code>&lt;</code><code>button</code> <code>type="button"&gt;請點選這裡&lt;/</code><code>button</code><code>&gt;</code>

 3、after() 函數在所有比對的元素之後插入 HTML 内容

<code>  </code><code>$("p").after(" Add  content.");</code>

 4、jQuery HTML 操作

函數

描述

$(selector).html(content)

改變被選元素的(内部)HTML

$(selector).append(content)

向被選元素的(内部)HTML 追加内容

$(selector).prepend(content)

向被選元素的(内部)HTML “預置”(Prepend)内容

$(selector).after(content)

在被選元素之後添加 HTML

$(selector).before(content)

在被選元素之前添加 HTML

本文轉自Work Hard Work Smart部落格園部落格,原文連結:http://www.cnblogs.com/linlf03/archive/2012/01/01/2309666.html,如需轉載請自行聯系原作者

繼續閱讀