jQuery如何实现点击页面获得当前点击元素的id或其他信息

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

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

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

})

示例代码如下

创建Html元素

<div class="box">

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

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

<div id = "test1">test1

<div id = "test2">test2

<div id = "test3">test3</div>

</div>

</div>

</div>

</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

JQuery中元素是否显示或者隐藏，有两种方式，主要通过获取元素节点的hidden和visible两个属性来进行判断，代码如下：

var

node=$('#id');

第一种写法

if(nodeis(':hidden')){//如果node是隐藏的则显示node元素，否则隐藏

nodeshow();　

}else{

nodehide();

}

第二种写法

if(!nodeis(':visible')){//如果node是隐藏的则显示node元素，否则隐藏

nodeshow();　

}else{

nodehide();

}

if(nodeis(':visible')){//如果node是显示的则隐藏node元素，否则显示

nodehide();

}else{

nodeshow();

}

query取得iframe中元素的几种方法

在iframe子页面获取父页面元素

代码如下:

$('#objId', parentdocument);

// 搞定

在父页面 获取iframe子页面的元素

代码如下:

$("#objid",documentframes('iframename')document)

$(documentgetElementById('iframeId')contentWindowdocumentbody)html()

显示iframe中body元素的内容。

$("#testId", documentframes("iframename")document)html();

根据iframename取得其中ID为"testId"元素

$(windowframes["iframeName"]document)find("#testId")html()

用JS或jQuery访问页面内的iframe,兼容IE/FF

注意:框架内的页面是不能跨域的!

假设有两个页面,在相同域下

indexhtml 文件内含有一个iframe:

XML/HTML代码

">

1、使用标签获取元素数组

2、遍历数组

3、判断每一个元素，找出css("display")为block的元素

具体代码如下：

 $(function(){

     //取出所有div，并遍历

     $("div")each(){

         //判断每一个div，其css中display是否为block

         if($(this)css("display")=="block"){

             alert('您想要的元素');

         }

     };

 });

如果你 的ajax 成功回调里面返回的参数 data 就是你上面说的那串 a 标签的话

你直接可以使用var $data = $(data)

var href = $dataattr('href')

var src = href splic('')[1]

$("#ceshi")append($(`<img src = "$(src )">`));

判断方法：

1、使用CSS属性

var display =$('#id')css('display');

if(display == 'none'){

alert("被你发现了，我是隐藏的啦！"

);}

2、使用jquery内置选择器

假设我们页面有这么个标签,

<div id="test"><p>仅仅是测试所用</p></div>

那么,我们可以用以下语句来判断id为"test"的标签是否隐藏:

if($("#test")is(":hidden")){} //前提是已经将jQuery的库导进来了

这样,我们就能够很简单地判断一个元素是否隐藏,并根据其状态来设置动,比如:

if($("#test")is(":hidden")){

$("#test")show();  //如果元素为隐藏,则将它显现

}else{

$("#test")hide();     //如果元素为显现,则将其隐藏

}

3、jQuery判断对象是否显示或隐藏

Js代码

// jQuery("#tanchuBg")css("display")

// jQuery("#tanchuBg")is(":visible")

// jQuery("#tanchuBg")is(":hidden")

扩展资料：

jQuery语言特点：

1、快速获取文档元素

jQuery的选择机制构建于Css的选择器，它提供了快速查询DOM文档中元素的能力，而且大大强化了JavaScript中获取页面元素的方式。

2、提供漂亮的页面动态效果

jQuery中内置了一系列的动画效果，可以开发出非常漂亮的网页，许多网站都使用jQuery的内置的效果，比如淡入淡出、元素移除等动态特效。

3、创建AJAX无刷新网页

AJAX是异步的JavaScript和ML的简称，可以开发出非常灵敏无刷新的网页，特别是开发服务器端网页时，比如PHP网站，需要往返地与服务器通信，如果不使用AJAX，每次数据更新不得不重新刷新网页，而使用AJAX特效后，可以对页面进行局部刷新，提供动态的效果。

4、提供对JavaScript语言的增强

jQuery提供了对基本JavaScript结构的增强，比如元素迭代和数组处理等 *** 作。

5、增强的事件处理

jQuery提供了各种页面事件，它可以避免程序员在HTML中添加太事件处理代码，最重要的是，它的事件处理器消除了各种浏览器兼容性问题。

6、更改网页内容

jQuery可以修改网页中的内容，比如更改网页的文本、插入或者翻转网页图像，jQuery简化了原本使用JavaScript代码需要处理的方式。

参考资料：

百度百科——jQuery

1、创建一个名称为css的html文件。

2、在页面中加入一个button按钮，当点击button的时候出发click事件。

3、在加入一个div设置宽和高还有背景色，当button的click事件中用css方法修改该div背景色。

4、文件引入jquery 库。

5、在文档准备方法中加入click点击事件。

6、在click事件中加入css方法设置div的背景色。

7、在浏览器中运行该文件。并点击button设置div的背景色。

find() 方法获得当前元素集合中每个元素的后代，通过选择器、jQuery 对象或元素来筛选。

语法：find(selector)   参数selector  字符串值，包含供匹配当前元素集合的选择器表达式。

详细说明：

如

果给定一个表示 DOM 元素集合的 jQuery 对象，find() 方法允许我们在 DOM

树中搜索这些元素的后代，并用匹配元素来构造一个新的 jQuery 对象。find() 与 children() 方法类似，不同的是后者仅沿着

DOM 树向下遍历单一层级。

find() 方法第一个明显特征是，其接受的选择器表达式与我们向 $() 函数传递的表达式的类型相同。将通过测试这些元素是否匹配该表达式来对元素进行过滤。

实例：

以上就是关于jQuery如何实现点击页面获得当前点击元素的id或其他信息全部的内容，包括:jQuery如何实现点击页面获得当前点击元素的id或其他信息、怎样判断jQuery 元素是否显示与隐藏、JavaScript或jquery获取frame的元素的值等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！