我有一个我无法解决的真正问题,我非常擅长计算机。使用javascript构建对象已经让我超越了优势。我有三个外部js文件和启动呼叫的HTML文件...
设置1
popup.HTML文件代码:
...
<script type="text/javascript" src="MethodObjects.js"></script>
<script type="text/javascript" src="popup (test Objects).js"></script>
...
MethodObject.js文件代码:
var URLDisectorO={
function URLDisector(URL){
//HERE THE COMPILER SAYS: Unexpected identifier Uncaught ReferenceError:
//I need to pass a URL into this from another function...
//test if the URL has google search in it
var myURL = "" + URL;
var index = mySearch(myURL, "https://www.google.com/search?q=");
if(index==-1){
document.getElementById('currentLink').innerHTML = myURL + "<br /><br />This URL <font color='blue'><b><u><i>WON'T</i></u></b></font> be blocked!";
}
else{
if(index==0){
document.getElementById('currentLink').innerHTML = myURL + "<br /><br />This URL <font color='red'><b><u><i>WILL</i></u></b></font> be blocked!";
}
else{
return "ERROR";
}
}
}
function mySearch(str, str1){
//Searches the URL for the two strings passed in...
var index=-1;
var strlength=str.length;
var str1length=str1.length;
var length=0;
if(strlength>str1length){
length=str1length;
}
else length=strlength;
for(var i=0; i<length; i++){
if(str.charAt(i)==str1.charAt(i)){
if(i>index && index==-1 && i<1){
index=i;
}
for(var j=i; j<length-1; j++){
if(str.charAt(j+1)==str1.charAt(j+1)){
i=j;
break;
}
else{
index=-1;
break;
}
}//end of inner for loop
if(index==-1){
break;
}
}
}//end of outer for loop
if(index>0){
return -1;
}
else{
return index;
}
}//end my search method
}
popup(对象方法测试).js文件代码:
//This is the file doing the calling and passing in stuff to the other file above...
//The HTML file called the JS file and it starts and it works until it gets down to...
var txtU="";
function getURL(){
chrome.tabs.getSelected(null, function(tab) {
var URL="";
document.getElementById('currentLink').innerHTML = tab.url;
URL = "" + document.getElementById('currentLink').innerHTML;
txtU+=URL;
alert("The URL is:\n\n" + txtU);
URLDisectorO.URLDisector(txtU);
//Object Call Here!
//HERE THIS DOESN'T WORK!!!
//The compiler says: Uncaught SyntaxError: URLDisectorO is not defined.
});
}
getURL();//The Call! The main method's call!
困扰我的是:
popup.js FILE代码在它是唯一的外部.js文件时工作,这行代码在HTML文件中......
SETUP 2
HTML文件代码:
...
<script type="text/javascript" src="MethodObjects.js"></script>
...
popup.js文件代码:
var txtU="";
function getURL(){
chrome.tabs.getSelected(null, function(tab) {
var URL="";
document.getElementById('currentLink').innerHTML = tab.url;
URL = "" + document.getElementById('currentLink').innerHTML;
txtU+=URL;
alert("The URL is:\n\n" + txtU);
URLDisector(txtU);
});
}
getURL();//The Call! The main method's call!
function URLDisector(URL){
var myURL = "" + URL;
var index = mySearch(myURL, "https://www.google.com/search?q=");
if(index==-1){
document.getElementById('currentLink').innerHTML = myURL + "<br /><br />This URL <font color='blue'><b><u><i>WON'T</i></u></b></font> be blocked!";
}
else{
if(index==0){
document.getElementById('currentLink').innerHTML = myURL + "<br /><br />This URL <font color='red'><b><u><i>WILL</i></u></b></font> be blocked!";
}
else{
return "ERROR";
}
}
}
function mySearch(str, str1){
var index=-1;
var strlength=str.length;
var str1length=str1.length;
var length=0;
if(strlength>str1length){
length=str1length;
}
else length=strlength;
for(var i=0; i<length; i++){
if(str.charAt(i)==str1.charAt(i)){
if(i>index && index==-1 && i<1){
index=i;
}
for(var j=i; j<length-1; j++){
if(str.charAt(j+1)==str1.charAt(j+1)){
i=j;
break;
}
else{
index=-1;
break;
}
}//end of inner for loop
if(index==-1){
break;
}
}
}//end of outer for loop
if(index>0){
return -1;
}
else{
return index;
}
}//end of method
问题是:我想使用对象,以便我可以一直访问这些方法,而不仅仅是一个特定的情况......对象会使这些代码更灵活......在需要的地方调用它们(SETUP 1 - 弹出(对象方法测试).js)虽然我仍然想保持上面的设置而不必恢复到下面的设置...
非常感谢任何帮助和错误修复说明!
答案 0 :(得分:0)
我无法理解你的问题,因为据我所说,你发布的信息太多了。但是,我认为您在html文件中以错误的顺序包含了js文件。试着写:
<script type="text/javascript" src="popup.js"></script>
高于其他所有。
另外,请花点时间编辑您的问题。让它更短更清晰。
答案 1 :(得分:0)
您需要为基于JavaScript的Web应用程序使用更好的设计模式。我建议看一下道格拉斯·克罗克福德的JavaScript: The Good Parts。
作为一种hacky方法,你总是可以拥有一个存储对你的方法的引用的全局对象,但我建议不要长期采用这种方法。
var foo = function () {
alert("hello world");
};
var globalContext = {
fooMethod : foo,
};
现在,您可以globalContext.fooMethod();
访问它。 JavaScript中的{}
创建存储key-&gt;值对的对象,值可以是其他类型的方法。
希望这有帮助!
答案 2 :(得分:0)
感谢HUGO对attach get/set function to objects property in js的评论,我能够理解我需要做什么。
以下是解决方案:
我需要创建一个变量并在其中存储一个函数。存储在变量中的函数用作对象封装结构(抱歉我的词汇 - 我可能会在错误的上下文中使用单词,但意图很好)。然后我需要在另一个类中创建该对象的实例。从那时起,我可以访问该对象内提供的方法和变量。
查看代码以了解有何不同之处。评论将指导您并告诉您为什么必须改为......
popup.HTML文件代码:
...
<script type="text/javascript" src="MethodObjects.js"></script>
<script type="text/javascript" src="popup (test Objects).js"></script>
...
MethodObject.js文件代码:
var global=function(){ //The declaration of a global variable set to a function object value...
var URL="";
this.URLD=function URLDisector(URL){ //This is different.
/*With this in front of the property name... this displays the correct format of how to include a function as a property of the Object...
*The correct way to call a method inside this object is:
*
*this.propertyName(parameter); OR this.propertyName();
*
*Though a correct declaration of this looks like:
*
*this.URLD=function URLDisector(URL){
*...code inside the method...
*};
*/
var myURL = "" + URL;
var index = this.search(myURL, "https://www.google.com/search?q="); //This is different.
if(index==-1){
document.getElementById('currentLink').innerHTML = myURL + "<br /><br />This URL <font color='blue'><b><u><i>WON'T</i></u></b></font> be blocked!";
}
else{
if(index==0){
document.getElementById('currentLink').innerHTML = myURL + "<br /><br />This URL <font color='red'><b><u><i>WILL</i></u></b></font> be blocked!";
}
else{
return "ERROR";
}
}
}
//end first inside Function
this.search=function mySearch(str, str1){ //This is different.
var index=-1;
var strlength=str.length;
var str1length=str1.length;
var length=0;
if(strlength>str1length){
length=str1length;
}
else length=strlength;
for(var i=0; i<length; i++){
if(str.charAt(i)==str1.charAt(i)){
if(i>index && index==-1 && i<1){
index=i;
}
for(var j=i; j<length-1; j++){
if(str.charAt(j+1)==str1.charAt(j+1)){
i=j;
break;
}
else{
index=-1;
break;
}
}//end of inner for loop
if(index==-1){
break;
}
}
}//end of outer for loop
if(index>0){
return -1;
}
else{
return index;
}
}
//end my search method
};
popup(对象方法测试).js文件代码:
var txtU="";
var g = new global(); /*This is different.
This line declares that:
We have an object with the instance name "g"
"g" contains the properties found inside the object or class called "global".*/
function getURL(){
chrome.tabs.getSelected(null, function(tab) {
var URL="";
document.getElementById('currentLink').innerHTML = tab.url;
URL = "" + document.getElementById('currentLink').innerHTML;
txtU+=URL;
alert("The URL is:\n\n" + txtU);
g.URLD(txtU);
/*This is different.
*This line says that we want to call the object name and, in this case,
*call the method property name "URLD" and pass in "txtU" as the parameter to it.
});
}
getURL(); //The Call! The main method's call!