用JS怎样显示自动获取城市和天气预报

JavaScript06

用JS怎样显示自动获取城市和天气预报,第1张

名称:265天气根据IP自动获得当地的天气情况

代码:<iframe src="http://weather.265.com/weather.htm" width="168" height="54" frameborder="no" border="0" marginwidth="0&quoatmarginheight="0" scrolling="no"></iframe>

名称:QQ天气预报代码(一)

代码 :<iframe width="145" height="130" border="0" align="center" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no" src="http://minisite.qq.com/Weather/news_new.html" allowTransparency="true"></iframe>

说明 :这种适合于在网页的边栏插入。但一个缺点是,上面的4个城市是既定的,无法改成别的。插 入时,选好网页上的位置,直接将左栏的源代码全部拷进去就行了

名称:QQ天气预报代码(二)

代码 :<IFRAME ID='ifm2' WIDTH='189' HEIGHT='190' ALIGN='CENTER' MARGINWIDTH='0' MARGINHEIGHT='0' HSPACE='0' VSPACE='0' FRAMEBORDER='0' SCROLLING='NO' SRC='http://weather.qq.com/inc/ss258.htm'></IFRAME>

说明 :这种 也适合于在网页的边栏插入。上面 的城市可以自定,比如厦门可改成别的。定制的方法是修改我代码中标红的数字,从1开始代表“香 港”开始,每个数字都代表一个城市,厦门是287,具体要哪个城市自己找一下罢。

名称:新浪天气预报代码

代码 :<IFRAME ID='ifm2' WIDTH='260' HEIGHT='70' ALIGN='CENTER' MARGINWIDTH='0' MARGINHEIGHT='0' HSPACE='0' VSPACE='0' FRAMEBORDER='0' SCROLLING='NO' src="http://news.sina.com.cn/iframe/weather/130101.html"></iframe>

说明 :这种适合于在网页的头栏插入。上面的城市可以自定,比如 石家庄可改成别的。

名称:QQ天气预报代码(三)

代码 :<iframe width="469" height="218" border="0" align="center" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no" src="http://appnews.qq.com/cgi-bin/news_weather_search?city=厦门" allowTransparency="true"></iframe>

说明 :这种适合于在网页的正栏插入。上面的城市可以自定,比如厦门可改成别的。定制的方法是修改我代码中标红的 名称。这里比较简单,直接用汉字改就行了。比如是福州的,你就直接把“厦门”改成福州就行。

名称:QQ天气预报代码(四)

代码 :<iframe width=160 height=230 frameborder=0 scrolling=NO src=http://appnews.qq.com/cgi-bin/news_qq_search?city=南昌></iframe>

名称:QQ天气预报代码(五)

代码 :<iframe src="http://appnews.qq.com/cgi-bin/news_qq_search?city=南昌" frameborder="0" width="160" scrolling="no" height="230"></iframe>

若后台返回格式如下:

let data = [

    {"createdAt": "2020-08-02T11:00:24.580Z", "name": "西瓜"},

    {"createdAt": "2020-08-03T11:00:24.580Z", "name": "水蜜桃"},

    {"createdAt": "2020-08-03T11:00:24.580Z", "name": "樱桃"},

    {"createdAt": "2020-08-02T11:00:24.580Z", "name": "西柚"},

]

      方法:使用 dayjs(createdAt).format('YYYY-MM-DD') 转换

      注:dayjs 安装引用

             npm install dayjs --save     import dayjs from 'dayjs'

     for ( let i=0i<array.lengthi++ ) {      

            let createdAt = dayjs(array[i].time)

            array[i].createdAt = createdAt

    }

 mapName (array) {

          let newArray = []

          array.forEach((item, i) =>{

              let index = -1

              let alreadyExists = newArray.some((newItem, j) =>{

                  if (item.createdAt === newItem.createdAt) {

                      index = j

                      return true

                  }

              })

              if (!alreadyExists) {

                  newArray.push({

                      createdAt: item.createdAt,

                      name: [item.name]

                  })

              } else {

                  newArray[index].price.push(item.name)

              }

          })

          return newArray

      }