JavaScript對象快捷方式

Question

我最近嘗試在JavaScript中編寫內置對象函數的快捷方式。

這就是：

function changeit(){ 
    var ge = getElementsByTagName() , doc = document; 
    doc.ge('div')[0].innerHTML = 'Changed'; 
} 

我thoughy它實際上工作，但事實並非如此。有沒有辦法讓它工作？我的意思是通過var名稱調用內置對象函數，它是否可以在所有瀏覽器中運行？

Answer 1

功能getElementsByTagName不幾乎不存在。你要訪問它的document屬性，但即使是這樣，你必須保存參考document還有：

var ge = document.getElementsByTagName.bind(document); 

或者，您也可以在名稱保存爲一個字符串：

var ge = 'getElementsByTagName'; 

然後，你可以這樣做：

document[ge]('div')... 

因爲obj['foo']等於obj.foo。

Answer 2

此：

var ge = getElementsByTagName() 

調用功能，或企圖。這個名稱沒有全局函數，所以它不起作用。同樣，

doc.ge('div') 

試圖找到「doc」的「ge」屬性，它也不存在;你只是聲明「ge」是一個局部變量，而不是「doc」的屬性。

如果你想有一個較短的名稱，只是做這樣的事情：

function ge(tagName) { return document.getElementsByTagName(tagName); } 

然後，你可以寫

ge('div')[0].innerHTML = 'Changed'; 

Answer 3

試試這個：

function changeit() 
{ 
    var ge = document.getElementsByTagName('div'); 
    ge[0].innerHTML = ge[0].innerHTML + ' Changed'; 
} 

測試在這裏：http://jsfiddle.net/aZAkz/1/

爲document.getElementsByTagName語法，你可以點擊這裏：https://developer.mozilla.org/en/DOM/document.getElementsByTagName

Answer 4

你在你的代碼，您可以創建一個變量叫什麼ge，它得到getElementsByTagname（）的結果。由於默認情況下您正在從窗口對象中選擇屬性，實際上您試圖將window.getElementByTagName()分配給該變量，但該窗口對象沒有這種屬性。所以你取代它。

現在第二個問題，你在調用方法而不是方法對象本身之後分配返回的值。所以ge = document.getElementsByTagName()應該變成ge = getElementsByTagName

然後，您創建另一個對象，稱爲doc，它實際上是文檔。但是，該文檔沒有名爲ge的屬性，您從未將該文檔對象的屬性設置爲ge。這是我會怎麼重寫代碼：

function changeIt(){ 
    var doc = document; 
    //this line works, because doc doesn't get a copy of the document object but a reference to it 
    //so changing document changes doc. 
    document.ge = document.getElementsByTagName; 
    doc.ge('div')[0].innerHTML = 'Changed'; 
} 

Answer 5

您可以設置包含一個指向任何物體屬性變量：

var gEBTN = document.getElementsByTagName; 
var gEBI = document.getElementById; 

當你需要使用它，你只需要鍵入gETBN('div')... ，或gEBI('elementId')...。你的情況：可製成

function changeIt() { 
    var ge = document.getElementsByTagName; 

    ge('div')[0].innerHTML = 'Changed'; 
} 

一些掛鉤，以避免類型的長命令，對象鏈，並且可以藏漢改變其值（鍵入下面的摘錄在JS控制檯來查看結果）：

改變在相同的範圍內

var originalObject = { 
    deepProperty: { 
    deepDeepProperty: { 
     someNumber: 0, 
     anotherNumber: 0, 
     someString: 'String', 
     anotherString: 'String', 
     someArray: ['a', 'b'], 
     anotherArray: ['a', 'b'] 
    } 
    } 
}; 
var hookA = originalObject.deepProperty; 
var hookB = originalObject.deepProperty.deepDeepProperty; 

hookA.siblingProperty = hookA; 

hookB.someNumber = 1; 
hookB.anotherNumber++; 

hookB.someString = 'Strong'; 
hookB.anotherString.replace(/i/, 'o'); 

hookB.someArray = ['b', 'c']; 
hookB.anotherArray.shift(); 
hookB.anotherArray.push('c'); 

console.log(originalObject); 
console.log(hookA); 
console.log(hookB); 

console.log(hookA === originalObject.deepProperty); 
console.log(hookB === originalObject.deepProperty.deepDeepProperty); 

INSIDE改變一個FUNCTION

var originalObject = { 
    deepProperty: { 
    deepDeepProperty: { 
     someNumber: 0, 
     anotherNumber: 0, 
     someString: 'String', 
     anotherString: 'String', 
     someArray: ['a', 'b'], 
     anotherArray: ['a', 'b'] 
    } 
    } 
}; 

function changeOriginalObject(obj) { 
    var hookA = obj.deepProperty; 
    var hookB = obj.deepProperty.deepDeepProperty; 

    hookA.siblingProperty = hookA; 

    hookB.someNumber = 1; 
    hookB.anotherNumber++; 

    hookB.someString = 'Strong'; 
    hookB.anotherString.replace(/i/, 'o'); 

    hookB.someArray = [ 
    'b', 
    'c' 
    ]; 
    hookB.anotherArray.shift(); 
    hookB.anotherArray.push('c'); 
} 

console.log(originalObject); 

changeOriginalObject(originalObject); 

console.log(originalObject);