资讯动态

js不用获取id属性, 直接可以用id名做事件绑定

发布时间:2026/10/23 1:40:43 来源:尧图企业网站定制
以下用一个实际栗子说明问题:// 定义两个输入框, 输入两个整数, 获取其最大公约数和最小公倍数标签内代码:bodydivclassrootinputtypetextidoneinputtypetextidtwobuttonidbtn/buttondividput/div/div/bodyjs代码:// 不用id绑定 btn和putbtn.onclickfunction(){varoneELdocument.getElementById(one).value;vartwoELdocument.getElementById(two).value;varmax0,min0;oneELtwoEL?maxoneEL:maxtwoEL;oneELtwoEL?minoneEL:mintwoEL;// divisorvardivisor0;for(vari1;imin;i){if(oneEL%i0twoEL%i0){divisori;}}// multiplevarmultiple0;for(varimax;ioneEL*twoEL;i){if(i%oneEL0i%twoEL0){multiplei;break;}}put.innerHTML(最大公约数为: divisor最小公倍数为: multiple);}// 用id绑定 btn和put// 绑定后btn--btnEL, put--putELvarbtnELdocument.getElementById(btn);varputELdocument.getElementById(put);btnEL.onclickfunction(){varoneELdocument.getElementById(one).value;vartwoELdocument.getElementById(two).value;varmax0,min0;oneELtwoEL?maxoneEL:maxtwoEL;oneELtwoEL?minoneEL:mintwoEL;// divisorvardivisor0;for(vari1;imin;i){if(oneEL%i0twoEL%i0){divisori;}}// multiplevarmultiple0;for(varimax;ioneEL*twoEL;i){if(i%oneEL0i%twoEL0){multiplei;break;}}putEL.innerHTML(最大公约数为: divisor最小公倍数为: multiple);}(二者得到结果相同)其中, 不进行id绑定时, 进行了鼠标点击事件(onclick)和输入事件(innerHTML)时, 也同样可以执行成功!二者得到结果相同, 由此可知, js获取id属性时, 可以不获取, 直接进行事件绑定!深层原因:为什么可以不获取?HTML5规范文档规定: 若一个元素符合下面两条规则中的任一条,则window对象中必须要有与之对应的一个属性,属性值就是这个对象.1.如果一个元素拥有ID属性,那么ID属性的属性值就会成为window对象的属性名.2.如果一个元素拥有name属性,那么name属性的属性值就会成为window对象的属性名.但这个元素的标签名必须是: a, applet, area, embed, form, frame, frameset, iframe, img, object,其中的一个.故满足此二者条件的id属性可以在不获取时直接进行使用.

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价 →
↑