javascript - 将 Javascript 推送到 DIV 标签

Question

我正在尝试将此 twitter 提要输出到右栏中的标签，但我不知道如何使其工作。似乎代码已设置为在其所在的任何位置打印。但是，我不能将代码放在页面的正文中。

http://cusli.org/NiagaraIntlMootCourt/NiagaraMoot.aspx

这是代码。我在 html 正文中有一个 id 为“comments”的 div 标签。

<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<style type="text/css">
#nav {
padding: 0 0 0 10px;
    margin: 0;
    list-style: none;
    width: 760px;
    height: 0px;
    background:#6E102B;
    margin-bottom: 5px;

    }
.twtr-hd, 
.twtr-ft,
.twtr-user
{ 
display: none; 
}
</style>

<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 30000,
  width: 250,
  height: 300,

  theme: {
    shell: {
      background: '#ffffff',
      color: '#000000'
    },
    tweets: {
      background: '#ffffff',
      color: '#000000',
      links: '#b80b0b'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    behavior: 'all'

  }


}).render().setUser('NiagaraMoot').start();

</script>

score 0 · Accepted Answer

 <div id="contentRight">

    <!-- this is your right coulmn, put TWitter script here -->
    <div class="myTwitter">
      <script>
         new TWTR.Widget({
           version: 2,

           ....

         }).render().setUser('NiagaraMoot').start();
      </script>
    </div> 
    <!-- end of your insert --> 

    <div id="dnn_ContentPane_Right">
     ....

CSS 和主 Tweeter JS 库应该保留在<head> ... </head>您页面的标记中 - 最好......如果你不能将它们放在那里......它们可以在你的页面中的任何位置，但就在 init 部分之前（如上所示）。我的意思是这部分：

<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<style type="text/css">
#nav {
padding: 0 0 0 10px;
    margin: 0;
    list-style: none;
    width: 760px;
    height: 0px;
    background:#6E102B;
    margin-bottom: 5px;

    }
.twtr-hd, 
.twtr-ft,
.twtr-user
{ 
display: none; 
}
</style>

score 0 · Accepted Answer

尝试这个：

<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<style type="text/css">
#nav {
padding: 0 0 0 10px;
    margin: 0;
    list-style: none;
    width: 760px;
    height: 0px;
    background:#6E102B;
    margin-bottom: 5px;

    }
.twtr-hd, 
.twtr-ft,
.twtr-user
{ 
display: none; 
}
</style>

<script>
var myThing = new TWTR.Widget({ //save you reference
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 30000,
  width: 250,
  height: 300,

  theme: {
    shell: {
      background: '#ffffff',
      color: '#000000'
    },
    tweets: {
      background: '#ffffff',
      color: '#000000',
      links: '#b80b0b'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    behavior: 'all'

  }


}); //remove from here

</script>

在你的 HTML 里面去

<div>
<script>
myThing.render().setUser('NiagaraMoot').start(); //add here
</script>

</div>

score 0 · Accepted Answer

将脚本标签放在要渲染的 div 中。

例如：

<html>
  <body>
    <h1>Hello world</h2>
    <div>
      <script type="text/javascript">
        new TWTR.Widget({
          version: 2,
          type: 'profile',
          rpp: 4,
          interval: 30000,
          width: 250,
          height: 300,

          theme: {
            shell: {
              background: '#ffffff',
              color: '#000000'
            },
          tweets: {
            background: '#ffffff',
            color: '#000000',
            links: '#b80b0b'
          }
         },
         features: {
           scrollbar: false,
           loop: false,
           live: false,
           behavior: 'all'    
         }        
         }).render().setUser('NiagaraMoot').start();
      </script>
    </div>
  </body>
</html>

javascript - 将 Javascript 推送到 DIV 标签

3 回答 3

Related

Reference