Chrome扩展如何获取JS动态生成的网页元素

太过爱你忘了你带给我的痛 2023-09-25 11:05 70阅读 0赞

### Chrome扩展如何获取JS动态生成的网页元素？ ###

如果想去给这些并不是由你控制动态生成出来的元素绑定事件应该是不可能的。

但是可以给顶层的document绑定事件来判断点击的是哪个元素。

Document

生成html

window.addEventListener('DOMContentLoaded',function()\{

varbtn=document.querySelector('\#btn')

varcontainer=document.querySelector('\#container')

//点击btn动态生成数据

btn.addEventListener('click',function()\{

container.innerHTML=''

container.innerHTML+='

*  2j13j13ji13kj2kjk2
 *  sadascc
 *  sabbbb
 *  3241241
 *  '
    
    container.innerHTML+='
    
    时间戳：'+(newDate).getTime()+'
    
    '
    
    document绑定click事件,
    
    document是顶层的html，通过绑定顶层的html去判断动态生成的节点是否存在，如果存在就执行
    
    document.addEventListener('click',function(e)\{
    
    vartarget=e.target//click指向的节点
    
    varnodeName=target.nodeName.toLocaleLowerCase()//click指向的节点tag
    
    if(nodeName==='li')\{
    
    //如果存在就执行，这里生成的是litag，所以这里成立，显示了li.textContent的内容
    
    alert(target.textContent)
    
    ![Chrome扩展如何获取JS动态生成的网页元素\_chrome扩展读取jquery对象][Chrome_JS_chrome_jquery]
    
    ### chrome浏览器下，怎么利用js或jquery获取本地ip地址，不要依赖第三方应用 ###
    
    具体解决方案如下：
    
    1、原因在于chrome不支持js在本地操作cookie!
    
    据测试，除了chrome浏览器外，其他主流浏览器(ie、firefox等)都支持js在本地操作cookie。当然部署到服务器上所有浏览器都是支持的。
    
    2、当然，还有另外一个原因：浏览器设置成不支持cookie。这样，调试js操作cookie当然也是不生效的。
    
    你以为，你乱写一通，我会给你分么。。。
    
    ### 为什么在 Chrome 插件中引用 jQuery 没有效果 ###
    
    可以f12打开控制台看看有没有报错, 看一下你是否引入了jQuery.js文件, 还有就是看看你浏览器的版本支持的JQuery版本号和你自己的版本号对比一下首先请检查浏览器是否禁用了javascript脚本。
    
    第二打开页面后，f12，看是否有报错。即使有一点报错也会终止相关的所有代码
    
    第三同样是打开页面后f12，在elements标签里的代码中，找你引用jquery的地方，你的jquery文件会显示一个超链接的形式，点击，看能否以查看代码的形式打开，若不可以说明引用文件或者引用路径错误
    
    最后，请检查代码中对于jquery文件的加载是否位于所有的调用jquery的函数之前
    
    ![Chrome扩展如何获取JS动态生成的网页元素\_chrome扩展读取jquery对象\_02][Chrome_JS_chrome_jquery_02]
    
    ### 谷歌浏览器怎么用jquery判断 ###
    
    判断$.browser.WebKit 等于True 就可以了
    
    苹果的Safari、谷歌的Chrome浏览器都是基于WebKit 这个框架来开发的jquery 1.8  
    if($.browser.chrome)  
    \{  
    alert("chrome browser!");  
    \}一句 var ischrome = navigator.useragent.tolowercase().match(/chrome/) != null; if (ischrome) \{ alert('chrome'); \}

[Chrome_JS_chrome_jquery]: https://img0.baidu.com/it/u=4144417109,3094619036&fm=15&fmt=auto
[Chrome_JS_chrome_jquery_02]: https://img1.baidu.com/it/u=1243162351,3783676464&fm=26&fmt=auto