获取动态添加的节点的ID

目的:在网页设计的过程中,有时候我们需要获取动态添加的节点的id,从而设置相应的属性或者事件。

方法:可以给动态添加的内容加上一个不显示的input,将其value设置为后台传过来的数据的某一个变量值。

如:<input type="hidden" value="+activity_id+" name="activity_id" />

var li_str =<li class="panel_content" id="activity+activity_id+">+
            	<input type="hidden" value="+activity_id+" name="activity_id" />+
	            <div class="content">+
	                <p class="p1"><strong >+title+</strong></p>+
	                <a id="entry+activity_id+" class="entry" οnclick="handleEntryEvent(this)">进入</a>+
	            </div>+
	            <div class="content">+
	                <p id="leftStatus+activity_id+" class="p1">+info+</p>+
	                <a id="+activity_id+" class="entry" οnclick="handleEndedActivity(this)">+activity_status+</a>+
	            </div>+
	            <div class="content content1">+
	                <p class="p1 font1">+create_time+</p>+
	                <a class="entry" οnclick="set(this);" id="set+activity_id+">设置</a>+
	            </div>+
	        </li>;
$("#ul_panel_content").append(li_str)

activity_id是从后台发回来的数据,值形式为“1”或者“2”等等。

现在我们用:<input type="hidden" value="+activity_id+" name="activity_id" />,

目的:现在想要获取到这个节点的id,对其定义事件

<a id="entry+activity_id+" class="entry" οnclick="handleEntryEvent(this)">进入</a>

思路:通过获取到input的value,从而得到 activity_id,进而得到节点的id

函数 handleEntryEvent(this)的js代码如下:这里的this是节点本身

// 处理”进入“按钮事件
	handleEntryEvent = function(node){
		var parents = node.parentNode.parentNode;
		var child = parents.children;
		console.log(child);
		var input_obj = child[0];
		var activ_id = input_obj.value;  //注意这里写的是js,不是在jquery框架写的,所以用Input_obj.val(),提示,input_obj.val is not a function
		var url =  globalConfig.pre_api_url + "/wall/index.php?activity_id=" + activ_id;
		var entry_obj = $("#entry"+activ_id);
		entry_obj.attr("target","_blank");
		entry_obj.attr("href",url)
	}
通过 activ_id = input_obj.value 就可以得到activity_id的值了,从而得到点击节点的id:entry_obj = $("#entry"+activ_id)
经验分享 程序员 微信小程序 职场和发展