Javascript 使用jquery添加倒计时。把这一页弄乱了。我做错了什么？_Javascript_Jquery

Javascript 使用jquery添加倒计时。把这一页弄乱了。我做错了什么？

javascript jquery

Javascript 使用jquery添加倒计时。把这一页弄乱了。我做错了什么？,javascript,jquery,Javascript,Jquery,首先，我已经读过了，在读过它之后，利用它所说的，我已经达到了一个不同的问题：是的，它向我展示了如何插入脚本标记，但是当它插入时它会“擦除”页面的其余部分：我想使用jQuery添加计数器计时器脚本。就在id=“counter”参数图之后然后在这个位置插入一个“计数器”：因此，与此代码不同： <body> <p> beginning of site</p> <table id="timer_table"> <tbody>

首先，我已经读过了，在读过它之后，利用它所说的，我已经达到了一个不同的问题：是的，它向我展示了如何插入脚本标记，但是当它插入时它会“擦除”页面的其余部分：

我想使用jQuery添加计数器计时器脚本。就在id=“counter”参数图之后然后在这个位置插入一个“计数器”：因此，与此代码不同：

<body>

<p> beginning of site</p>

<table id="timer_table">
    <tbody>
        <tr>
            <td>
                <p id="counter"  style="color: red;"> Here's the counter: </p>

            </td>
        </tr>
    </tbody>
</table>

<p> rest of site...</p>

</body>

<body>

<p> beginning of site</p>

<table id="timer_table">
    <tbody>
        <tr>
            <td>
                <p id="counter"  style="color: red;"> Here's the counter: </p>
                <script>
                    var myCountdown1 = new Countdown({time:316});
                </script>
            </td>
        </tr>
    </tbody>
</table>

<p> rest of site...</p>

</body>

js1.js简单地说：

var myCountdown1 = new Countdown({time:316});

它不好用。而不是得到这样的结果：我得到这个：

当我试图检查页面源代码时，我什么也得不到

总而言之：如何使用jquery在id=“counter”段落后面插入coundown并且它会像原始html中已经写入了这一行一样工作。

此外，我无法访问页面的html源代码。如果我有我会添加它自己，它会工作得很好，就像在第一个图片链接所示。因此，我不得不使用Jquery

您可以在这里尝试自己（使用第二个链接进行尝试）：
这就是我想要的：
但是使用jquery进行操作：
注意，在第二个链接中，请尝试放置

var myCountdown1 = new Countdown({time:316});

在ss1中，查看发生了什么。

谢谢。

不要尝试插入脚本标记，而是使用倒计时计时器中的代码将其插入正确的位置。有关工作示例，请参见

关键部分是将容器添加到HTML中（在本例中，它是ID为

target\u location

的

div

）

所以HTML变成了（在运行JS代码插入div之后）


场地起点
这是柜台：
网站的其余部分

然后是JS（添加新的div，然后运行倒计时）

$（'#计数器'）。在（''）之后；
var myCountdown1=新的倒计时（{time:316，target:'target_location'}）；

此外，我无法访问页面的html源代码

好吧，这是一个令人沮丧的问题。如果你不能按照@Blair McMillan的建议去做，你也可以选择一种远不如我想象的漂亮/直截了当/多才多艺/有用的方法：

var html = $("body").html();
var str = html.split(/<p id="counter" style="color: red;"> Here's the counter:/g);
new Countdown({time:99999999});
$("body").prepend(str[0] + '<p id="counter" style="color: red;"> Here\'s the counter:');
$("body").append(str[1]);

var html=$（“body”）.html（）；
var str=html.split（/这是计数器：/g）；
新的倒计时（{时间：9999999}）；
$（“body”）.prepend（str[0]+'这是计数器：）；
$（“正文”）。追加（str[1]）；

小提琴：

我在干什么

捕获页面的HTML

将其拆分到您希望计数器显示的位置。这是非常难看的部分，因为我正在匹配容器元素以及文本的确切HTML。基本上，就是在它前面显示的元素

然后加载计数器，清除页面的HTML

在HTML的前半部分以及我们在步骤2中匹配的字符串前面加上前缀

您添加了下半部分，成功地用原始HTML包含倒计时

缺点？很多。这一点都不通用。在倒计时出现之前，您必须匹配位置的确切文本，这只允许它在非常特定的情况下工作。另外，我刚刚记得jQuery自动完成标记，因此这只会将计数器包装成完整的标记

希望这能告诉你，总是有其他的方法来做事情，你也可以改进它！

也许我忽略了一些东西，但是如果你可以访问javascript，你所要做的就是在一个脚本标记中写入一行，我必须问你为什么不直接将js文件的内容写入begin而不是这个解决方法？我的意思是用var myCountdown1替换var脚本…因为它无论如何都是js？这不是问题，即使我使用这行：$（'#counter'）。在（'var myCountdown1=new Countdown（{time:316}）；'）之后，我也会得到相同的结果（坏）结果。事实上，我的js文件比这长得多。我只是把它缩短成一行，因为我问了这个问题。它还是一样（糟糕）result.ty.这不是我的意思。我想说的是，当你可以从js调用文件本身时，为什么要尝试为dom写一个脚本标记。可能类似于.getScript，这样你就可以直接读取js文件的内容。布莱尔·麦克米兰：谢谢，这很有效。我不完全理解为什么，但是ty.Ye-我忘记了没有访问权限到html源代码，但如果我使用jquery首先添加这个div id=target_位置，然后使用该脚本，可能会起作用。我会尝试，这会起作用。对不起，我也忘了。我会更新我的答案。至于为什么会起作用，我想倒计时源可以告诉我去哪里，而不必是一个

tag。因此我找到了列出可选设置的源代码。其中一个是“target”它指定了它应该放在DOM中的位置。致Charlie：链接不起作用。这种情况在我身上经常发生，如果你使用页面末尾的便笺，然后尝试保存该内容，就会发生。不过感谢你的解释。它帮助我理解了一些内容，只需按上面的run键。我确实按了run键，计数器显示只有零，你的计数器显示的数字正确吗？奇怪。太糟糕了，如果我能用你所做的，那就太棒了。

<body>

<p> beginning of site</p>

<table id="timer_table">
    <tbody>
        <tr>
            <td>
                <p id="counter"  style="color: red;"> Here's the counter: </p>
                <div id="target_location"></div>
            </td>
        </tr>
    </tbody>
</table>

<p> rest of site...</p>

</body>

$('#counter').after('<div id="target_location"></div>');
var myCountdown1 = new Countdown({time:316, target:'target_location'});

var html = $("body").html();
var str = html.split(/<p id="counter" style="color: red;"> Here's the counter:/g);
new Countdown({time:99999999});
$("body").prepend(str[0] + '<p id="counter" style="color: red;"> Here\'s the counter:');
$("body").append(str[1]);