Question

当尝试循环到图像URL时，我尝试创建一个函数，然后将该URL分配给Twitter图像内容，但是在Twitter图像上单击共享之后，则保持不变。

我尝试将meta放在首位，将属性更改为name，尝试在单击共享时使用js创建meta标签，还尝试注释掉twitter：img meta标签，但是twitter仍然得到了我的旧图片（即使没有Twitter meta标签T_T）帮助！！！！

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
            <title>Document</title>
        </head>
        <body>
            <meta property="twitter:card" content="summary" />
            <meta property="twitter:site" content="@Frankie_D_Pang" />
            <meta property="twitter:title" content="This is title" />
            <meta property="twitter:image" content="" />

            <img src="" alt="" class="the_img" />
            <button onclick="img_num()">plus</button>

            <a href="https://twitter.com/intent/tweet?text=Scalyr+media+gallery+new+cartoon&url=http://www.shengdesign.com/practice/share/twshare/twshare.html" 
                   rel="noopener"
                   target="_blank">Share on Twitter</a>
            <h1 class='numHolder'/>
            <meta property="twitter:description" content="This is content testing" />

            <script>
                let img_container = ['https://images.pexels.com/photos/414612/pexels-photo-414612.jpeg', 'http://www.imgworlds.com/wp-content/uploads/2015/12/generic.jpg'];

                let num = 0;
                const img_num = () =>{
                    num ++;
                    if(num > 1){
                        num = 0;
                    }
                document.querySelector('.numHolder').innerHTML = num;
                document.querySelector('meta[property="twitter:image"]').setAttribute('content', img_container[num]);
                document.querySelector('.the_img').src = img_container[num];
                }

                const tw_share = () =>{
                    let share_img_url = document.getElementById('light_box_img').src;
                    document.querySelector('meta[property="twitter:image"]').setAttribute('content', share_img_url);
                }
            </script>
        </body>
</html>

如何创建动态Twitter分享功能

0 个答案: