十年專注于品牌網(wǎng)站建設(shè) 十余年專注于網(wǎng)站建設(shè)_小程序開發(fā)_APP開發(fā),低調(diào)、敢創(chuàng)新、有情懷!
      南昌百恒網(wǎng)絡(luò)微信公眾號 掃一掃關(guān)注
      小程序
      tel-icon全國服務(wù)熱線:400-680-9298,0791-88117053
      掃一掃關(guān)注百恒網(wǎng)絡(luò)微信公眾號
      掃一掃打開百恒網(wǎng)絡(luò)微信小程序

      百恒網(wǎng)絡(luò)

      南昌百恒網(wǎng)絡(luò)

      css讀取HTML內(nèi)容實現(xiàn)方法

      CSS讀取HTML LHY 2024-02-22 1401
             從事小程序開發(fā)過程中,需要實現(xiàn)通過樣式CSS讀取HTML中的內(nèi)內(nèi)容,我通過實例向大家介紹功能實現(xiàn)方法,接下來由南昌小程序開發(fā)公司百恒網(wǎng)絡(luò)開發(fā)工程師通過實例向大家介紹實現(xiàn)方法。

      例如把更多拼接在省略號后面


      <view class="dynamics-txt r-simpledata-etc="...展開">
       當(dāng)一個人喜愛梭魚跳躍的水聲時,他是個詩人;當(dāng)他知道了這不過是強者追趕弱者的聲音時,他是個思想家。可是要是他不懂得這種追逐的意義所在、這種毀滅性的果所造成的平衡為什么有其必要時,他就會重<text>收起text>
      view>
      .r-simple::before{content:attr(data-etc); position: absolute; bottom: 0; right:0px; background: #fff; color: #999999;}




      html:


       <view class="pd-10-0">
               <rich-text id="comment-rich-text-{{index}}" 
                  nodes="{{ item.content }}" 
                  class="r-content {{!!item.extendStr ? \'r-content-simple\' : \'\'}}">
               rich-text>
            view>
            <view class="extendBtnbindtap="extendEventdata-index="{{index}}" wx:if="{{item.extendBtn}}">{{item.extendStr ? \'收起\':\'展開\'}}view>



      JS:

        //同圖片加載完成計算文字高度
         listenCommentUserAvatarLoad: function (event) {
            let commentIdx = event.currentTarget.dataset.index
            var query = wx.createSelectorQuery();
            query.select(`#comment-rich-text-${commentIdx}`).boundingClientRect((rect) => {
               if (rect != null{
                  const height = rect.height
                  if (height > 120{ //Line-height 24 * 5 行
                     this.data.dataList[commentIdx][\'extendStr\'= true;
                     this.data.dataList[commentIdx][\'extendBtn\'= true;//是否顯示展開按鈕
                     this.setData({
                        dataList: this.data.dataList
                     })
                  }
               }
            }).exec()
         },
         //展開事件
         extendEvent:function(event){
            let commentIdx = event.currentTarget.dataset.index
            let curItem = this.data.dataList[commentIdx];
            this.data.dataList[commentIdx][\'extendStr\'= curItem.extendStr ? false:true;//是否全部顯示
            this.setData({
               dataList: this.data.dataList
            })
         },

      以上都是南昌小程序開發(fā)公司百恒網(wǎng)絡(luò)有十多年開發(fā)經(jīng)驗的開發(fā)工程師經(jīng)過實際操作總的實用經(jīng)驗,希望對廣大技術(shù)人員有所幫助。

      百恒網(wǎng)絡(luò),專業(yè)專注于南昌小程序開發(fā)、南昌APP開發(fā),南昌網(wǎng)站建設(shè),為用戶提供高品質(zhì)網(wǎng)絡(luò)產(chǎn)品和優(yōu)質(zhì)服務(wù)是我們始終的追求,歡迎來電咨詢洽談。



      400-680-9298,0791-88117053
      掃一掃關(guān)注百恒網(wǎng)絡(luò)微信公眾號
      掃一掃打開百恒網(wǎng)絡(luò)小程序

      歡迎您的光顧,我們將竭誠為您服務(wù)×

      售前咨詢 售前咨詢
       
      售前咨詢 售前咨詢
       
      售前咨詢 售前咨詢
       
      售前咨詢 售前咨詢
       
      售前咨詢 售前咨詢
       
      售后服務(wù) 售后服務(wù)
       
      售后服務(wù) 售后服務(wù)
       
      備案專線 備案專線
       
      ×
      亚洲av日韩精品久久久久久a| 免费精品人在线二线三线区别| 国内精品久久久久影院网站| 日韩av无码成人无码免费| 日本精品视频一区二区三区| 日韩欧美亚洲国产精品字幕久久久| 四虎永久在线日韩精品观看| 亚洲AV日韩精品久久久久久久 | 国产成人精品一区二区三区| 日韩精品无码熟人妻视频| 国产成人久久精品| 国产精品爽爽V在线观看无码| 国产精品成人久久久久久久| 亚洲日韩精品国产3区| 国产高清国内精品福利| 久久在精品线影院精品国产 | 91精品国产自产在线观看高清| 久久精品福利视频| 精品一区二区三区中文字幕| 国产午夜无码精品免费看动漫| 韩国三级中文字幕hd久久精品| 国产精品偷窥熟女精品视频| 日本精品少妇一区二区三区| 日韩精品一区二区三区毛片| 日韩精品中文字幕在线观看| 美日韩一区二区三区| 日韩午夜免费视频| 精品理论片一区二区三区| 日韩午夜在线视频| 无码精品久久一区二区三区| 乱人伦精品视频在线观看| 无码国产亚洲日韩国精品视频一区二区三区| 日韩人妻潮喷中文在线视频| 精品一区二区三区视频| 亚洲精品麻豆av| 国产精品自在线拍国产第一页| 精品国产呦系列在线观看免费| 国产午夜精品久久久久九九电影 | 亚洲AV无码成人网站久久精品大| 国产精品女同一区二区| 久久精品国产99精品国产亚洲性色|