在li的第n个元素注入Adsense

Question

我正在尝试在带有 jQuery 的列表项的第 4 和第 7 个元素中注入 AdSense，但是当我使用 AdSense 但与普通 html 或文本一起工作时，我目前拥有的东西中断了.

这是我的

<script>
    $(document).ready(function() {
        var couter = 1;
        $( ".page-itemlist li" ).each(function() {

            if(couter==4 || couter==7){
                $(this).before( '<li class="adsense-here"> ADSENSE GOES HERE</li>' );
            }
            couter++;
        });
    });
</script>

上面的方法有效，但是当我插入 AdSense 时它坏了，这就是我想要实现的目标：

    <script>
        $(document).ready(function() {
            var couter = 1;
            $( ".page-itemlist li" ).each(function() {

                if(couter==4 || couter==7){
                    $(this).before( '
                                   <li class="adsense-here">

<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-7615453880179233"
     data-ad-slot="3708363880"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

                                   </li>'
                   );
                }
                couter++;
            });
        });
    </script>

Answer 1

javascript 中的单引号不支持多行字符串。

你需要使用反引号`

                    $(this).before( `
                                   <li class="adsense-here">

<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-7615453880179233"
     data-ad-slot="3708363880"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

                                   </li>`
                   );

        $(document).ready(function() {
            var couter = 1;
            $( ".page-itemlist li" ).each(function() {

                if(couter==4 || couter==7){
                    $(this).before( `
                                   <li class="adsense-here">

<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-7615453880179233"
     data-ad-slot="3708363880"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
<\/script>

                                   </li>`
                   );
                }
                couter++;
            });
        });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="page-itemlist">
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
  <li>6</li>
  <li>7</li>
  <li>8</li>
</ul>

在li的第n个元素注入Adsense

Inject Adsense in the nth element of li

javascript

jquery

adsense