歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
Linux教程網 >> Linux編程 >> Linux編程 >> 在JavaScript 中創建JSON對象--例程分析

在JavaScript 中創建JSON對象--例程分析

日期:2017/3/1 9:28:47   编辑:Linux編程

要想用程序從網頁上抓數據,需要熟悉HTML和JavaScript語言,這裡有一個在學習JSON時碰到的例程,就是在Javascript 中創建JSON對象,為了學習並掌握其內容,按我的理解對此例程做個注釋,記錄我掌握的知識,以備將來驗證是否正確。

程序很簡單,分三部分(代碼在本文後面):

1、<h2>部分:用大字符顯示標題;

2、<p>部分:顯示一段信息的結構,但無內容,內容在後面添加;

3、<scrip>部分:Javascript程序,先定義了一個JSON結構的變量JSONObject,然後,用變量中的內容填寫到<p>部分,定位方式是通過其中定義的id,這裡詳細說明一下:

語句document.getElementById("jname").innerHTML=JSONObject.name就是找id為jname的元素,把其中的內容替換為JSONObject.name,這個變量的內容為Bill Gates,即:

將<span id="jname"></span>修改為<span id="jname">Bill Gates</span>,由id定位到標簽span,而InnerText表示標簽元素span中間部分的文本內容(不含標簽元素)。

我們用程序從網頁上抓數據時,往往需要填表,也是通過這種方式修改網頁內容,最後提交,得到我們需要的內容,例如,下面語句就是填寫郵件號碼並提交查詢:

WebBrowser1.Document.GetElementById("mailNum").InnerText = “1126381490399”
WebBrowser1.Document.Forms("mailTrackSnglForm").submit

也可以用下面的寫法:

WebBrowser1.document.Forms("mailTrackSnglForm").All("mailNum").Value =“1126381490399”

再比如,填寫用戶名和密碼後提交:

WebBrowser1.Document.Forms(0).All("name").Value = "AHSD08"
WebBrowser1.Document.Forms(0).All("password").Value = "ems2345"
WebBrowser1.Document.Forms(0).submit

對應網頁中的元素或者說對象定位,可以用id名稱,也可以用序號,比如上例中的Forms(0)。

下面是上面分析的例程代碼:

<html>
<body>
<h2>在 JavaScript 中創建 JSON 對象www.linuxidc.com</h2>

<p>
Author: <span id="jauthor"></span><br />
Name: <span id="jname"></span><br />
Age: <span id="jage"></span><br />
Address: <span id="jstreet"></span><br />
Phone: <span id="jphone"></span><br />
</p>

<script type="text/javascript">
var JSONObject= {
"name":"Bill Gates",
"street":"Fifth Avenue New York 666",
"age":56,
"phone":"555 1234567"};
document.getElementById("jname").innerHTML=JSONObject.name
document.getElementById("jage").innerHTML=JSONObject.age
document.getElementById("jstreet").innerHTML=JSONObject.street
document.getElementById("jphone").innerHTML=JSONObject.phone
document.getElementById("jauthor").innerHTML="iamlaosong"
</script>

</body>
</html>

執行效果如下:

在 Javascript 中創建 JSON 對象www.linuxidc.com

Author: iamlaosong
Name: Bill Gates
Age: 56
Address: Fifth Avenue New York 666
Phone: 555 1234567

--------------------------------------分割線 --------------------------------------

Struts中異步傳送XML和JSON類型的數據 http://www.linuxidc.com/Linux/2013-08/88247.htm

Linux下JSON庫的編譯及代碼測試 http://www.linuxidc.com/Linux/2013-03/81607.htm

jQuery 獲取JSON數據[$.getJSON方法] http://www.linuxidc.com/Linux/2013-03/81673.htm

用jQuery以及JSON包將表單數據轉為JSON字符串 http://www.linuxidc.com/Linux/2013-01/77560.htm

在C語言中解析JSON配置文件 http://www.linuxidc.com/Linux/2014-05/101822.htm

--------------------------------------分割線 --------------------------------------

Copyright © Linux教程網 All Rights Reserved