目標：2021年2月起，每周一篇文章翻譯，從跟程式相關的短文/新聞開始，過程中也會接觸到程式專有名詞，能試著自己詮釋加強概念。4月起主題，從SOLOLEARN平台做JavaScript篇章的翻譯，11月全部完成。12月起主題，從SOLOLEARN平台做jQuery篇章的翻譯。

■□■ Jan, Week 1 ■□■ Title: jQuery Author、Platform: SOLOLEARN Source: https://www.sololearn.com/learning/1082

Get Content

取得內容

There are several methods for manipulating the content of HTML elements via jQuery.
The html() method is used to get the content of the selected element, including the HTML markup. For example:

透過jQuery操控(manipulate)HTML元素內容的方法有很多種，html()方法被用於取得被選取元素的內容，包含HTML標記(markup)，例如：
HTML:

<p>
JQuery is <b>fun</b>
</p>

JS:

$(function() { var val = $("p").html(); alert(val); }); // alerts "JQuery is <b>fun</b>"

Notice, that the HTML markup (the <b> tags) is also returned,
If you need only the text content, without the HTML markup, you can use the text() method:

注意HTML的標記(<b>標籤)也被回傳，如果你只需要文字內容，不要HTML標記，你可以使用text()方法：

$(function() {
var val = $("p").text();
alert(val);
});
// alerts "JQuery is fun"
TIP:The html() and text() methods can be used for all HTML elements that can contain content.

提示：html()和text()方法可以被用於所有包含內容的HTML元素。

-----

Set Content

設定內容

The same html() and text() methods can be used to change the content of HTML elements.
The content to be set is provided as a parameter to the method, for example:

一樣的html()和text()方法，也可以被用於改變HTML元素的內容。
要被設定的內容是以參數(parameter)提供給方法，例如：
HTML:

<div id="test">
<p>some text</p>
</div>

JS:

$(function() {
$("#test").text("hello!");
});

The code above changes the content of the element with id="test" to "hello!".

上面的程式碼將id是test的元素內容改變為hello!

TIP:If the content you are setting contains HTML markup, you should use the html() method instead of text().

提示：如果你設定的內容包含HTML標記，你應該使用html()方法而不是text()。

-----

val()

val()方法

We have seen in the previous lesson how we can manipulate the content of HTML elements using the text() and html() methods.
Another useful method is the val() method, which allows us to get and set the values of form fields, such as textboxes, dropdowns, and similar inputs. For Example:

我們在前面的課程中已經看過如何使用text()和html()方法操控HTML元素的內容。另一個實用的方法就是val()方法，它讓我們可以從表格區域(form fields)中取得和設定數值，像是文字方塊(textboxes)、下拉式選單(dropdowns)和相似的輸入。例如：

HTML:

<input type="text" id="name" value="Your Name">

JS:

$(function() { alert($("#name").val()); }); //alerts "Your Name"

Similarly, you can set the value for the field by providing it as a parameter to the val() method.

同樣地，你可以透過參數提供val()方法去設定區域的值： 

TIP:Getting and setting form field values is very useful when you need to handle form events and validation. We will cover events later in the course.

提示：取得和設定表格區域的數值是非常實用的，當你需要處理表格事件和驗證時，我們之後的課程將介紹到事件。

-----

Summary

總結

The following jQuery methods are available to get and set content and attributes of selected HTML elements:
text() sets or returns the text content of selected elements.
html() sets or returns the content of selected elements (including HTML markup).
val() sets or returns the value of form fields.
attr() sets or returns the value of attributes.
removeAttr() removes the specified attribute.

下列的jQuery方法在被選取HTML元素的取得、設定內容及屬性派得上用場：
text() 設定或回傳被選取元素的文字內容
html() 設定或回傳被選取元素的內容(包含HTML標記)
val() 設定或回傳表格區域的數值
attr() 設定或回傳屬性的數值
removeAttr() 移除指定的屬性

TIP:Write code and test every method at least one time.

提示：寫程式碼並測試每個方法至少一次。

-----

翻譯小心得｜ 針對經常使用的取得內容和改變內容，有基礎但精要的介紹說明，搭配簡單練習，很容易就可以上手。 Finally, the article above is from SOLOLEARN .  I translated it just for practice, personal use only. If that is inappropriate, please contact me.
 This free site is ad-supported. Learn more
​