`
fanjf
  • 浏览: 329776 次
  • 性别: Icon_minigender_1
  • 来自: 安徽
社区版块
存档分类
最新评论

js中document.getElementById在IE出错在Firefox正确

 
阅读更多

Element_value = document.getElementById (ID_name )
参数:
ID_name:必选项 字符串(String)。
返回值:
Element_value: 获取对应ID名字 对象(Element)。
说明:
根据指定的id属性值得到对象。返回id属性值等于ID_name的第一个对象的

引用。假如对应的为一组对象,则返回该组对象中的第一个。
如果无符合条件的对象,则返回 null 。

它是一个document对象的方法,可以通过它来获得指定id的html元素。
例如在页面里表单元素你可以给它设置id值,或name值来区别同种类型的不同元素,当你设置id document.getElementById("id")来得到这个

元素,从而通过document.getElementById("id").value 得到元素的值,类似的方法还有document.getElementsByName("name")通过元素名称

来获得元素对象。document.getElementsByTagName("form")通过标签名称获得元素。

document.getElementById的一些细节
document.getElementById 有时会抓name放过了id ,据说是IE的一个BUG

———————————————————
<html>
<head>
<title>JS的document.getElementById的bug</title>
<script language="javascript">
 
   function test()
   {
    var obj = document.getElementById('category_id');
    alert(obj.value);
   }
</script>
</head>
<body >

input的文本框的name="category_id" <br/>
select的下拉链的id="category_id" <br/>
用document.getElementById应该取得第二个,但是取到的却是第一个 <br/>

<input type="text" id="hello8" name="category_id" value="inputVal" />

<select id="category_id" onchange="al();">
    <option value ="selectVal">下拉链</option>
</select>

<input type ="button" onclick="test()" value ="test">

</body>
</html>
———————————————————
name=category_id.在IE中getElementById竟然不是先抓id而是先找name

相同的物件...


两个form,每个form有两个textbox,两个form中的textbox是相同的name,

但id都不同...
這樣在Firefox是沒問題的...但在IE卻只抓得到第一个出現的name資料

下面这段代码可以验证这个结果
————————————————————
<html>
<head>
<title>document.getElementById在IE错误,Firefox正确</title>
</head>
<script language="JavaScript">
<!--
function chkacc(){
    alert(document.getElementById("userId").value);//理论值:1 实际值: 1
    alert(document.getElementById("passwordId").value); //理论值:2 实际值:2
    alert(document.getElementById("userName").value); //理论值:A 实际值:1
    alert(document.getElementById("password").value); //理论值:B 实际值:2
}
//-->
</script>

<body>
<h3>第一个Form表单</h3>
<form method="post" action="" name="frm1">
<input type="text" name="userName" id="userId" value="1"/>
<input type="text" name="password" id="passwordId" value="2"/>
</form>

<h3>第二个Form表单</h3>
<form method="post" action="" name="frm2">
<input type="text" NAME="userName" id="userName" value="A"/>
<input type="text" NAME="password" id="password" value="B"/>
<input type="button" value="检查" name="btnchk" onclick="chkacc();" />
</form>

</body>
</html>
————————————————————

② javascript中的getElementbyId使用
网页中的元素必须有id属性,才能通过这个方法得到,比如
<input type=text name="content" id="content">

③获取html标记主要有两种方法,一种是通过ID值,一种是通过name属性
name属性主要用于form表单内的input标记

分享到:
评论

相关推荐

    ie与火狐中常见的一些兼容问题.doc

    - **现有问题**:代码中存在大量使用`document.formName.item("itemName")`的语句,这种方式在Firefox(火狐)浏览器下无法正常工作。 - **解决方法**:将这些语句替换为`document.formName.elements["elementName...

    javascript中快速定位的方法

    1. **Firefox错误控制台**:按下`Ctrl+Shift+J`可以打开Firefox的错误控制台,它能够立即显示出当前页面中的JavaScript错误,并直接跳转到出错的代码位置。 - **优点**:操作简单,反馈及时。 2. **其他浏览器的...

    JS IE和FF兼容性问题汇总

    当使用集合类对象时,如`document.forms("formName")`在Firefox中会出错,而IE可以接受。修复的方法是使用数组索引语法,将`()`替换为`[]`,如`document.forms["formName"]`。 3. **window.event问题**: 在IE中...

    Javascript在IE下设置innerHTML时出现未知的运行时错误的解决方法

    [removed] ”trone”&gt; &lt;/tr&gt; 在IE中,有时候会出现”未知的运行时错误(unknown runtime error)”,而在firefox里不会。 这主要是IE在对innerHTML进行写操作的时候会检查element是否具备做为这些内容中html对象容器的...

    ie浏览器使用js导出网页到excel并打印

    本文将详细介绍如何使用JavaScript在IE浏览器中实现网页信息的导出到Excel以及打印功能。这种方法适用于对功能需求不那么复杂的小型项目,能够以简洁的方式实现所需功能,同时便于系统维护。 首先,我们需要创建一...

    大名鼎鼎SWFUpload- Flash+JS 上传

    在FireFox中,如果窗口的滚动条没有回滚到顶部,那么Flash无法加载 Race-conditions when files are cached 兼容ASP.Net Forms SWFUpload v2 延续了SWFUpload的设计目标,将UI分离以交给开发人员控制和后续扩展 ...

    基于JS判断iframe是否加载成功的方法(多种浏览器)

    对于非IE浏览器,如Firefox、Opera、Chrome等,它们支持`iframe`的`onload`事件。当`iframe`内容加载完毕时,`onload`事件会被触发。下面是如何使用`addEventListener`来监听`onload`事件: ```javascript var ...

    ajax实例,兼容各个主流浏览器

    由于不同浏览器对XMLHttpRequest对象的支持程度不同,我们需要编写兼容代码来确保在所有主流浏览器(如IE、Firefox、Chrome、Safari等)中都能正常工作。以下是一些常见的兼容性问题及解决方案: #### 2.1 创建...

    XML轻松学习手册--XML肯定是未来的发展趋势,不论是网页设计师还是网络程序员,都应该及时学习和了解

    面向对象的思想方法已经非常流行了,在编程语言(例如java,js)中,都运用面向对象的编程思想。在XML中,就是要将网页也作为一个对象来操作和控制,我们可以建立自己的对象和模板。与对象进行交流,如何命令对象,...

    JS中innerHTML和pasteHTML的区别实例分析

    由于pasteHTML是IE特有,因此在其他浏览器(如Firefox、Chrome、Safari等)中不适用。 总的来说,innerHTML是一个DOM属性,广泛支持且用途广泛,适用于大多数HTML内容的插入和更新。而pasteHTML是一个非标准方法,...

    解决IE下select标签innerHTML插入option的BUG(兼容IE,FF,Opera,Chrome,Safari)

    本文将详细讨论一个特定的JavaScript问题,即在Internet Explorer(IE)浏览器中使用`innerHTML`属性向`&lt;select&gt;`元素插入`&lt;option&gt;`标签时遇到的bug,以及如何解决这个bug以实现跨浏览器兼容性,包括IE、Firefox、...

    JQuery中html()方法使用不当带来的陷阱

    而在其他现代浏览器(如IE9、Firefox、Safari、Chrome和Opera)中,空格并未被忽略,所以长度为7。 这种差异可能导致条件判断在非IE浏览器下出错。为了解决这个问题,我们可以采取以下两种策略: 1. **编写HTML时...

Global site tag (gtag.js) - Google Analytics