js通过id获取元素的子级元素的奇怪现象_框架

这是因为ID是具有全局唯一性的，也就是说同一个页面是不允许出现相同ID的元素的（当然你在html中可以设定相同的id，但js只能定位到第一个），所以要想通过id来获取页面元素，只需要全局定位（即documentgetElementById）即可，不需要在子元素中再来进一步定位。事实上，正是因为上述原因，getElementById是document对象的特有方法，其他对象是没有这个方法的，这就是为什么listgetElementById会提示说不是函数的原因！

我是冲分来的^^，可以给个参考方案

获取页面所有p节点距文档左上角坐标，缓存起来

页面加载完成时或页面滚动时，通过坐标查找此时屏幕最底部的p节点

对此节点 *** 作

示例(刚写的，在chrome测试可用，兼容古董浏览器稍微改下代码)：

<!DOCTYPE html>

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

(function(){

var list=[],elems=documentquerySelectorAll("p");

for(var i=0,y,elem;i<elemslength;i++){

elem=elems[i];

y=0;

do{

y+=elemoffsetTop;

if(elemnodeName!="BODY"){

y-=elemscrollTop;

};

}while(elem=elemoffsetParent);

listpush({elem:elems[i],y:y});

};

var prev;

function get(){

var top=documentbodyscrollTop

,height=documentdocumentElementclientHeight

,bottom=top+height;

for(var i=0,o;i<listlength;i++){

o=list[i];

if(oy>bottom){

break;

};

elem=oelem;

};

//此时elem为最底下可见元素,开搞了

prev&&(prevstyleborder="none");

prev=elem;

elemstyleborder="solid red 2px";

consolelog(elemid);

};

windowaddEventListener("load",get);

windowaddEventListener("scroll",get);

windowaddEventListener("resize",get);

})();

</script>

</body></html>

获取所有的Id值，方法是通过divclass获取全局的值，然后再提取具体的Id值

方法一：用for循环，因为$（"divclass"）获取的是一个数组，通过循环读取出数组中的每一个元素：

123456var articleIdList = new Array();var h3=$("divrow");for (var i = 3;i< h3length; i++) { //一共有53个元素，所需要的Id从第四个开始取的 var articleId = h3eq(i)attr("id"); var articleIdList = articleIdListconcat(articleId);};

方法二：利用自带的函数：

123$("divrow")each(function(){ alert($(this)attr("id"));})

如下代码可以实现点击页面获得被点击元素的id

$(document)click(function(e) { // 在页面任意位置点击而触发此事件

$(etarget)attr("id"); // etarget表示被点击的目标

})

示例代码如下

创建Html元素

点击页面后，设置被点击元素背景色并获取其id：

<div class="content" id = "test">test

<div id = "test1">test1

<div id = "test2">test2

</div>

设置css样式

divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}

divbox span{color:#999;font-style:italic;}

divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}

divcontent div{min-width:20px;min-height:20px;padding:30px;border:1px solid #446699;background:#ffffff;}

bg{background:#ff99cc !important;}

编写jquery代码

$(function(){

$(document)click(function (e) {

$(etarget)addClass('bg'); // 设置背景色

alert($(etarget)attr('id')); // 获取id

})

观察效果

初始状态

点击id为test2的div

把list中的某一属性值（项目唯一id）取出来放到一个单独的list中List<Unit> unitlist = new ArrayList<>()。

List<String> idList = unitliststream()map(Unit::getId)collect(CollectorstoList())，将idList用分隔符，拼接成字符串。

StringUnildjoin(idListtoArray()，java">public class Test {public static void main(String[] args) {List<String> list = new ArrayList<>()。

listadd("a");listadd("b")；listadd("c")；listadd("d")；String str = ""，for(int i=0;i<listsize()；i++){str += listget(i)+","}

我把你的代码复制下来试了试，目前遇到的问题是

var lis = listgetElementsByTagName('input');

这行代码中lis的值无法获取到，然后我发现

var list = documentgetElementById("one");

这行代码你获取的是id为one的元素，但是你的html代码里面并没有id为one的元素，所以你的lis没有获取到值，所以后面的代码都无效。

记住，class和id是不一样的getElementById获取的是id

以上就是关于js通过id获取元素的子级元素的奇怪现象全部的内容，包括:js通过id获取元素的子级元素的奇怪现象、js 动态获取，当前窗口中最后一个元素的id、Jquery通过ID获取元素，返回数组是几个意思等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！

欢迎分享，转载请注明来源：内存溢出

原文地址:https://54852.com/web/9667558.html

js通过id获取元素的子级元素的奇怪现象

发表评论

评论列表（0条）