DIV里的ID=“xxx”,这个ID的数据怎么取

DIV里的ID=“xxx”,这个ID的数据怎么取,第1张

你自己取,在一个页内不要重复

以后代码要找这个DIV进行 *** 作需要ID

如:

<div id="div1">

</div>

var obj documentgetElementById("div1");

这个obj就是你定义的

<div id="div1">

</div>

思路:通过id可以获取到<div>对象,通过getAttribute()和innerHTML分别可以获取<div>对象的自定义属性和文本内容。下面实例演示获取<div>标签的自定义属性user_id: 1、HTML结构 <div id="test" user_id="test_id">id="test" user_id="test_id"</div><br/> <input type='button' value='获取div的自定义属性' onclick="fun()"/> 2、javascript代码 function fun(){ obj = documentgetElementById("test"); alert(objgetAttribute("user_id")) } 3、点击按钮后效果

jq可以直接使用$("div")获得所有div,但是如果要具体到一个div的话,需要给div一个标记,然后通过html就可以获取值了。

1<div id="divId" class="divClass"> 内容 </div>

123/jq 代码 jq选择器/$("#divId")html();$("divClass")html();

思路:通过id可以获取到<div>对象,通过getAttribute()和innerHTML分别可以获取<div>对象的自定义属性和文本内容。下面实例演示获取<div>标签的自定义属性user_id:

1、HTML结构

<div id="test" user_id="test_id">id="test" user_id="test_id"</div><br/>

<input type='button' value='获取div的自定义属性' onclick="fun()"/>

2、javascript代码

function fun(){

obj = documentgetElementById("test");

alert(objgetAttribute("user_id"))

}

3、点击按钮后效果

1、首先给div绑定click事件。

2、通过this,结合parents方法找到tr。

3、通过attr方法获取id的值。

4、具体代码

var tr_id=$(this)parents("tr")eq(0)attr("id");

拓展:parents()和attr()方法具体说明可查看Jquery官方文档。

思路:利用jQuery选择器直接根据类名获取对象→遍历对象→使用 attr() 方法获取id属性值。下面实例演示——获取所有class为test的元素的id值:

1、HTML结构

<div class="test" id="div_id">我的类是test,id是div_id</div>

<input type="text" class="test" id="input_id" value="我的类是test,id是input_id" />

<div class="test">我的类是test,没有id属性</div>

<li class="test" id="li_id">我的类是test,id是li_id</li>

<input type="button" value="确定">

2、jQuery代码

$(function(){

$("input[type='button']")click(function() {

var ids = [];

$("test")each(function(index, el) {

var id = $(this)attr("id");

if(typeof(id)!=='undefined'){

idspush(id)

}

});

alert(ids);

});

});

3、效果演示

以上就是关于DIV里的ID=“xxx”,这个ID的数据怎么取全部的内容,包括:DIV里的ID=“xxx”,这个ID的数据怎么取、js如何获取写在<div>里面的值、jquery中怎么获取div中的值等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9656970.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-30
下一篇 2023-04-30

发表评论

登录后才能评论

评论列表(0条)

保存