2008-11-10 77 views
17

我有一些代碼這樣做:getElementsByName在IE7

var changes = document.getElementsByName(from); 
for (var c=0; c<changes.length; c++) { 
    var ch = changes[c]; 
    var current = new String(ch.innerHTML); 
    etc. 
} 

這在FF和鉻罰款,但不是在IE7。大概是因爲getElementsByName在IE中不起作用。什麼是最好的解決方法?

回答

17

如果你不知道這是爲什麼不工作在IE,這裏是the MSDN documentation on that function

當您使用getElementsByName方法,具有指定NAME屬性或ID文檔中的所有元素屬性值被返回。

支持NAME屬性和ID屬性的元素包含在getElementsByName方法返回的集合中,但具有NAME expando的元素不包含在集合中;因此,此方法不能用於按名稱檢索自定義標籤。

Firefox允許getElementsByName()檢索使用NAME expando的元素,這就是它工作的原因。不管這件事是否是一件好事™都可能引起爭議,但這是事實。

因此,一種選擇是使用getAttribute()DOM方法來詢問NAME屬性,然後測試值以查看它是否是您想要的值,如果是,則將其添加到數組中。但是,這需要您遍歷頁面中的所有節點,或者至少在一個子節點內進行迭代,這不是最有效的。也許你可以事先約束這個列表,使用getElementsByTagName()等。

如果您控制頁面的HTML,則另一種方法是爲所有感興趣的元素提供一個僅根據數字而不同的Id。:

<div id="Change0">...</div> 
<div id="Change1">...</div> 
<div id="Change2">...</div> 
<div id="Change3">...</div> 

然後有JavaScript的是這樣的:

// assumes consecutive numbering, starting at 0 
function getElementsByModifiedId(baseIdentifier) { 
    var allWantedElements = []; 
    var idMod = 0; 
    while(document.getElementById(baseIdentifier + idMod)) { // will stop when it can't find any more 
     allWantedElements.push(document.getElementById(baseIdentifier + idMod++)); 
    } 
    return allWantedElements; 
} 

// call it like so: 
var changes = getElementsByModifiedId("Change"); 

這是一個黑客,當然,但它會做你需要的工作,不要太低效比較一些其他黑客。

如果您正在使用某種形式的JavaScript框架/工具包,你的選擇是好多了,但我沒有時間去進入這些細節,除非你知道你使用了一個。就我個人而言,我不知道人們如何生活沒有一個人,他們節省了太多的時間,精力和沮喪,以至於無法承擔使用而不是

4

有幾個問題:

  1. IE確實混亂id=""name=""
  2. name=""是不允許的<span>

要解決,我建議:

  1. 將所有name=""更改爲class=""
  2. 改變這樣的代碼:

-

var changes = document.getElementById('text').getElementsByTagName('span'); 
for (var c=0; c<changes.length; c++) { 
var ch = changes[c]; 

if (ch.className != from) 
continue; 

var current = new String(ch.innerHTML); 
+0

好,謝謝。該頁面在這裏(http://lwww.dege.ukfsn.org/encrypt/decode.php),它是通過字母頻率分析對代碼進行破解的簡單例證。在IE中輸入字母時,您可能需要點擊標籤。在FF中,回報也是如此。 – sa386 2008-11-10 18:39:29

+1

謝謝。改爲課堂是很好的解決方案 – sa386 2008-11-10 19:47:44

+0

起初,我不認爲這在我的IE 11或IE 8中都能正常工作,但是我的大小寫在.getElementById()中的'Id'上不正確。我犯了這麼多錯誤!但在修復*我自己的*錯誤後,IE 8和IE 11都能很好地工作。感謝您提供的最佳解決方案!如果只有IE瀏覽器的工作,以及其他瀏覽器!我希望Edge不會那麼糟糕。時間會證明。 – 2016-01-19 22:27:26

1

getElementsByName支持在IE瀏覽器,但也有缺陷。特別是它返回'id'匹配給定值的元素,以及'name'。如果沒有更多的上下文,代碼和實際的錯誤信息,無法分辨出是否存在問題。

一般來說,getElementsByName可能是最好的避免,因爲HTML中的'name'屬性有幾個重疊的目的,可以混淆。使用getElementById更可靠。當專門處理表單字段時,可以更可靠地使用form.elements [name]來檢索要查找的字段。

+0

getElementsByName實際上是有用的,如果你只*查找表單字段的NAME屬性實際上是W3C規範的一部分。也就是說,實際使用它將是一件難得的事情。 – 2008-11-10 19:06:03

2

這不是很經常會發現使用NAME屬性的元素。我會建議切換到ID屬性。

但是,您可以找到使用jQuery特定名稱的元素:

$("*[name='whatevernameYouWant']"); 

這將返回給定名稱的所有元素。

1

我使用包裝返回元件的陣列已經成功。在IE 6和7中也可以使用。請記住,它不是100%與document.getElementsByName完全相同,因爲它不是NodeList。但是對於我所需要的,就是在元素數組上運行一個for循環來完成簡單的事情,比如設置.disabled = true,它就可以工作得很好。

雖然這個功能仍然使用getElementsByName,它的工作原理,如果使用這種方式。你自己看。

function getElementsByNameWrapper(name) { 
    a = new Array(); 

    for (var i = 0; i < document.getElementsByName(name).length; ++i) { 
    a.push(document.getElementsByName(name)[i]); 
    } 

    return a; 
} 
1

解決方法

   var listOfElements = document.getElementsByName('aName'); // Replace aName with the name you're looking for 
      // IE hack, because it doesn't properly support getElementsByName 
      if (listOfElements.length == 0) { // If IE, which hasn't returned any elements 
       var listOfElements = []; 
       var spanList = document.getElementsByTagName('*'); // If all the elements are the same type of tag, enter it here (e.g.: SPAN) 
       for(var i = 0; i < spanList.length; i++) { 
        if(spanList[i].getAttribute('name') == 'aName') { 
         listOfElements.push(spanList[i]); 
        } 
       } 
      }