Javascript 一次调用Jquery，而不是作为外部源_Javascript_Jquery_Html

Javascript 一次调用Jquery，而不是作为外部源

javascript jquery html

Javascript 一次调用Jquery，而不是作为外部源,javascript,jquery,html,Javascript,Jquery,Html,我从外部源调用Jquery时遇到一些问题。如果我嵌入这个外部源，整个页面都会运行Jquery，这会导致页面上不同模块的兼容性问题我想做的是调用Jquery一次，并在页面中运行一点html后关闭它，但我似乎不能这样做，我已经设置了一个JS提琴来显示我的问题。小提琴不起作用，但我希望它能为我的问题提供一个例子 <head> <link rel="stylesheet" type="text/css" href="http://www.khl.com/other_files/929

我从外部源调用Jquery时遇到一些问题。如果我嵌入这个外部源，整个页面都会运行Jquery，这会导致页面上不同模块的兼容性问题

我想做的是调用Jquery一次，并在页面中运行一点html后关闭它，但我似乎不能这样做，我已经设置了一个JS提琴来显示我的问题。小提琴不起作用，但我希望它能为我的问题提供一个例子

<head>
<link rel="stylesheet" type="text/css" href="http://www.khl.com/other_files/929.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>
var gstock = ["TYO:5233", "HKG:1893", "HKG:2009", "BIT:IT", "ASX:BLD", "TPE:1101", "NYSE:VMC", "TYO:5232", "NYSE:MLM", "BME:CPL", "HKG:1666", "BKK:SCC"];
$(document).ready(function () {
    for (var i = 0; i < gstock.length; i++) {
        $.getJSON("https://finance.google.com/finance/info?client=ig&q=" + gstock[i] + "&callback=?", function (response) {
            var stockInfo1 = response[0];
            var divContainer = $('*[data-symbol="' + stockInfo1.t + '"]');
            var divCurrency = $('*[data-currency="' + stockInfo1.d + '"]');
            var percentStock = !isNaN(stockInfo1.c) && !isNaN(stockInfo1.l) && stockInfo1.l ? ((parseFloat(stockInfo1.c)/parseFloat(stockInfo1.l)) * 100) : undefined;
            var stockString1 = '<div class="stockWrapper">' + divContainer.data('title') + ':';
            var stockName1 = stockInfo1.t;
            var stockCurency1 = stockInfo1.d;
            var stockPrice2 = "";

            stockPrice2 += '<span class="stockSymbol "> ' + stockInfo1.l + '</span>';     
            var stockChange = "";
            stockString1 += '<span class="stockSymbol "> ' + stockInfo1.t + ' </span>';
            if(!isNaN(percentStock) && percentStock > 0) {
                percentStock = Number((percentStock).toFixed(2));
                stockChange += '<span class="stockChange "> ' + percentStock + ' %</span>';
            } else if(!isNaN(percentStock)) {
                percentStock = Number((percentStock).toFixed(2));
                stockChange += '<span class="stockPrice "> ' + percentStock + ' %</span>';
            } else {
                stockChange += '<span class="stockPrice "></span>';
                stockChange += percentage + '% </span>';               

            }
            stockString1 += stockChange + '</div>';
            $("#title").append("<div>" + divContainer.data('title') + "</div>");
            $("#symbols").append("<div><b>" + stockInfo1.t + "</b></div>");
          $("#currency").append("<div><b>" + $(divContainer).attr( 'data-currency') + "</b></div>");
            $("#livePrice").append("<div>" + stockPrice2 + "</div>");
            $("#liveData").append("<div>" + stockChange + "</div>");
            divContainer.append(stockString1);



        });
    }
});<script></head>

<body>
<div class="container">
<div class="marquee"> 
<div class="19300" data-symbol="5233" data-title="TAIHEIYO" data-currency="JPY" style="display: none;" ></div>
<div class="19400" data-symbol="1893" data-title="CNMC" data-currency="USD" style="display: none;" ></div>
<div class="19500" data-symbol="2009" data-title="BBMG" data-currency="HKD" style="display: none;" ></div>
<div class="19600" data-symbol="IT" data-title="ITALCEMENTI" style="display: none;" ></div>
<div class="19700" data-symbol="BLD" data-title="BORAL" data-currency="AUD" style="display: none;" ></div>
<div class="19800" data-symbol="1101" data-title="TAIWAN CEMENT" data-currency="NTD" style="display: none;" ></div>
<div class="19900" data-symbol="ULTRA" data-title="UTC" data-currency="USD" style="display: none;" ></div>
<div class="20000" data-symbol="5232" data-title="SUMITOMO" data-currency="JPY" style="display: none;" ></div>
<div class="20100" data-symbol="VMC" data-title="VULCAN MATERIALS" data-currency="USD" style="display: none;" ></div>
<div class="20300" data-symbol="MLM" data-title="MARTIN MARIETTA" data-currency="USD" style="display: none;" ></div>
<div class="20500" data-symbol="CPL" data-title="CPV" data-currency="EUR" style="display: none;" ></div>
<div class="20600" data-symbol="1666" data-title="TONG YANG" data-currency="HKD" style="display: none;" ></div>
<div class="20700" data-symbol="SCC" data-title="CIAM" data-currency="THB" style="display: none;" ></div>
<div class="box">
<div id="title" class="floatleft2"></div>
<div id="currency" class="floatleft999"></div>
<div id="livePrice" class="floatleft20"></div>
<div id="liveData" class="floatleft9"></div>
</div></div>
</div>
</body>


var gstock=[“TYO:5233”、“HKG:1893”、“HKG:2009”、“BIT:IT”、“ASX:BLD”、“TPE:1101”、“NYSE:VMC”、“TYO:5232”、“NYSE:MLM”、“BME:CPL”、“HKG:1666”、“BKK:SCC”]；
$（文档）.ready（函数（）{
对于（变量i=0；i0）{
百分比库存=数量（（百分比库存）.toFixed（2））；
股票变动率+=''+股票百分比+'%；
}如果（！isNaN（股票百分比））{
百分比库存=数量（（百分比库存）.toFixed（2））；
股票变动率+=''+股票百分比+'%；
}否则{
股票交易+=''；
股票变动+=百分比+'%'；
}
stockString1+=stockChange+''；
$（“#title”）.append（“+divContainer.data（'title'）+”）；
$（“#符号”）.append（“+stockInfo1.t+”）；
$（“#货币”）.append（“+$（divContainer）.attr（‘数据货币’）+”）；
$（“#livePrice”）。追加（“+stockPrice2+”）；
$（“#liveData”）。追加（“+stockChange+”）；
divContainer.append（stockString1）；
});
}
});

上面显示了我试图运行Jquery，然后是它下面的html。然后我希望一切都结束

我知道这不是做生意的通常方式，但在同一页的后面，我想调用一个非常类似的jquery，它输出更多的股票。发生的事情是jquery与前面的部分有类似的冲突，因为API使用相同的名称，它不会在我的屏幕上输出。所以我只能得到一个片段

我可能会在这件事上犯错，因为我是新来的，但任何帮助都将不胜感激

JS小提琴：

最终，我尝试在同一页面上复制两次这个代码，而不产生任何冲突：

如果您将其作为jQuery扩展/插件重新编写，那么多个实例将变得很简单（代码也更易于维护）。这还意味着，如果需要，您可以缓存特定的库存，以节省每个实例的加载。您不能“关闭”jQuery，即使可以，即使稍后打开jQuery，冲突仍然存在。这是因为jQuery所做的一切都是让您选择要修改的HTML部分。发生冲突是因为代码在两个代码段中选择了相同的部分。我怀疑以插件或泛型函数的形式重新编写对您来说可能是不可行的，因此我只能建议您在每个页面上只使用一次此类代码片段以避免冲突。jQuery扩展非常简单。不要推迟使用更好的方法，我相信这对您来说是非常可行的：）您需要开始使用类选择器和类（而不是ID），因为ID不能在页面上复制。我还建议您从数据数组中创建选框条目，而不要尝试同步它们。每个条目只需要数组中的附加属性就可以从数据中创建div。如果您将其作为jQuery扩展/插件重新编写，那么多个实例将非常简单（并且代码更易于维护）。这还意味着，如果需要，您可以缓存特定的库存，以节省每个实例的加载。您不能“关闭”jQuery，即使可以，即使稍后打开jQuery，冲突仍然存在。这是因为jQuery所做的一切都是让您选择要修改的HTML部分。发生冲突是因为代码在两个代码段中选择了相同的部分。我怀疑以插件或泛型函数的形式重新编写对您来说可能是不可行的，因此我只能建议您在每个页面上只使用一次此类代码片段以避免冲突。jQuery扩展非常简单。不要推迟使用更好的方法，我相信这对您来说是非常可行的：）您需要开始使用类选择器和类（而不是ID），因为ID不能在页面上复制。我还建议您从数据数组中创建选框条目，而不要尝试同步它们。每个条目只需要数组中的附加属性就可以从数据创建div。