css - 如何在组件刷新时添加 LinkedIn Badge DOM 更改代码
问题描述
我在 Angular html 文件中嵌入了 LinkedIn Badge html 代码并添加了
<script type="text/javascript"
src="https://platform.linkedin.com/badges/js/profile.js" async defer>
</script>
在 index.html 中,它仍然只显示链接而不是徽章。徽章仅在我刷新页面时显示,并且在 DOM 中,当组件刷新时代码会被添加。
我想添加此 DOM 代码,以便在不刷新页面的情况下显示徽章。如何做到这一点?
以下是我的html代码
<div class="LI-profile-badge" data-version="v1" data-size="medium"
data-locale="en_US" data-type="horizontal" data-theme="light"
data-vanity="divya-dave-23456b356">
<a class="LI-simple-link"
href='https://in.linkedin.com/in/divya-trk=profile-badge'>
Divya
</a>
</div>
遵循刷新页面时添加到 DOM 上的代码:
<div><script src="https://static-exp1.licdn.com/sc/h/3qk7aqkysw7gz575y2ma1e5ky" type="text/javascript"></script><code id="__pageContext__" style="display: none;"><!----></code><script src="https://static-exp1.licdn.com/sc/p/com.linkedin.badger-frontend%3Abadger-frontend-static-content%2B1.0.2/f/%2Fbadger-frontend%2Fsc-hashes%2Fsc-hashes_en_US.js"></script><script src="https://static-exp1.licdn.com/sc/h/19dd5wwuyhbk7uttxpuelttdg"></script><link rel="stylesheet" href="https://static-exp1.licdn.com/sc/h/c5izpj9x1e2q31kvb2g3w9ptv"><div dir="ltr" class="LI-badge-container-horizontal-light LI-badge-container horizontal light medium" style="display: none"> <div class="LI-profile-badge-header LI-name-container LI-row"><div class="LI-col"><div class="LI-profile-pic-container"><img src="https://media-exp1.licdn.com/dms/image/C5103AQFYXRtyDCvPsA/profile-displayphoto-shrink_200_200/0?e=1591833600&v=beta&t=F-mTttfMKDxEk-8-6hkrPZCRnbibURICKa-U-m-gu60" class="LI-profile-pic"></div></div><div class="LI-col LI-header"><div class="LI-name"><a href="https://in.linkedin.com/in/divya-dave?trk=profile-badge-name">Divya Dave</a></div><div class="LI-title"></div></div></div><ul class="LI-more-info"><li class="LI-field"><img src="https://static-exp1.licdn.com/scds/common/u/images/themes/katy/ghosts/company/ghost_company_80x80_v1.png" class="LI-field-icon" alt=""></li><li class="LI-field"><img src="https://media-exp1.licdn.com/dms/image/C4E0BAQF-NKQHUG7hUg/company-logo_200_200/0?e=1594252800&v=beta&t=PCVRH-tcYArMwDqJ27wRVcRwRtcVwvAkhOYU5Ml-GKQ" class="LI-field-icon"><a href=""></a></li></ul><div class="LI-footer LI-row"><a href="" class="LI-view-profile">View profile</a><span class="LI-logo"><img src="https://static-exp1.licdn.com/scds/common/u/images/logos/linkedin/logo_linkedin_93x21_v2.png" alt="LinkedIn" class="LI-icon"></span></div></div></div>
我想在不刷新组件的情况下显示徽章
解决方案
推荐阅读
- python - 将数据传递到字典以创建熊猫数据框表时,为什么不能使用类结构中的数组?
- vb.net - VB.NET:DataGridView 同一列中的不同按钮
- android - 如何使用 rxjava 实时更新列表?
- javascript - 在 MVC 模式中,避免在我的视图类中调用控制器的最佳方法是什么?
- angular - Angular Ionic 3 Form Builder以正确的方式验证消息
- sql - 两个临时表的 SQL 加法
- mysql - 如何在日期范围内加入 MySQL 表?
- amazon-web-services - 我有一个 50gb vdi 映像,托管它以进行分发的最佳方式是什么?
- javascript - Angular - 有效地创建验证器
- pivot-table - Google Data Studio:如果单元格中的记录少于 x,是否可以在数据透视表中过滤结果?