• 关于

    dom对象(document)

    的搜索结果

回答

不应该说“div.find($("ul"))” ,应该是 div.find("ul") 吧…… $(...)括号里第二个参数如果是jQuery对象或者Dom对象的话,就是以该对象为上下文进行查询。这相当于一种简写法,可以缩短源码,并且在packer的时候可以减少一个词汇。 当然,如果没有这个参数的话,默认的查询上下文就是整个Dom文档。 //原语句 var div = $(this), ul = $("ul", div), tLi = $("li", ul); //等同于 var div = $(this), ul = div.find('ul'), tLi = ul.find('li'); //省略第二个上下文对象参数的情况 $('ul') == $('ul',document) == $(document).find('ul');

小旋风柴进 2019-12-02 02:17:32 0 浏览量 回答数 0

回答

自版本1.3之后,jQuery采用了Sizzle库,与之前的版本在选择器引擎上的表现形式有很大的不同。它用“从左至右”的模型代替了“从右至左”的模型。确保最右的选择器具体些,而左边的选择器选择范围较宽泛些。$("#one .tao") ,违背了上面的原则。 var a = ($(".two"),$("#one")); 楼主写错了吧,应该是: var a = ($(".two",$("#one")); 吧。这段代码的逻辑是: 通过$("#one")找对对应的DOM元素(封装成jquery对象,假如命名为A)$(".two",$("#one")): 以A作为上下文(在A对应的DOM元素内查找),构造新的jquery对象,对象里DOM元素的class值包含 .two这种方式应该是最优的吧,就相当于:`var ele = document.getElementById('one');var eles = document.getElementsByClassName('two'); `//注意代码的兼容性用jquery写就是:$('#one').find('.two');

小旋风柴进 2019-12-02 02:24:18 0 浏览量 回答数 0

回答

1 jQuery(selector,context) 简要的说是:接收一个css选择器表达式(selector)和可选的选择器上下文(context),返回一个包含了匹配的DOM元素的jQuery对象。 默认情况下,对匹配元素的查找都是从根元素ducument对象开始,也就是说查找范围是整棵文档树。但是如果给定了上下文context,则在指定上下文中查找 html <span>body span</span> <span>body span</span> <span>body span</span> <div class="wrap"> <span>wrap span</span> <span>wrap span</span> <span>wrap span</span> </div> js $('span').css('background-color','red');//所有的span都会变红 $('span','.wrap').css('background-color','red');//只有.wrap中的span会变红 2 jQuery(html,ownerDocument) 、jQuery(html,props) 用所提供的html代码创建DOM元素 对于jQuery(html,ownerDocument),参数html可以是单标签或者是多层标签之间的嵌套。第二个参数用于创建新DOM元素的文档对象,如果不传入则默认为当前的文档对象。 //单标签 两种方式都可以往body中插入div /* * 1 $('<div>').appendTo('body'); * 2 $('<div></div>').appendTo('body'); */ // 多标签嵌套 $('<div><span>dfsg</span></div>').appendTo('body'); 另外:对于单标签,jQuery(html,props),props是一个包含属性和事件的普通的对象,用法如下。(该用法有待考证,请知道这一用法的童鞋告知一下,感激不尽) $('<div>我是div</div>',{ title:'我是新的div', click:function(){ $(this).css('color','red'); console.log(this); } }).appendTo('body'); 3 jQuery(element or elementsArray) 如果传入一个DOM元素或者是DOM元素的数组,则把DOM元素封装到jQuery对象中并返回。 html <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> </ul> js // 传入DOM元素 $('li').each(function(index,ele){ $(ele).on('click',function(){ $(this).css('background','red');//这里的DOM元素就是this }) }) //传入DOM数组 var aLi=document.getElementsByTagName('li'); aLi=[].slice.call(aLi);//集合转数组 var $aLi=$(aLi); $aLi.html('我是jQuery对象');//所有的li的内容都变成'我是jQuery对象' 4 jQuery(object) 如果传入的是一个object对象,则把该对象封装到jQuery对象中并返回。 var obj={name:'谦龙'}; var $obj=$(obj);//封装成jQuery对象 //绑定自定义事件 $obj.on('say',function(){ console.log(this.name)//输出谦龙 }); $obj.trigger('say'); 5 jQuery(callback) 当传进去的参数是函数的时候,则在document对象上绑定一个ready事件监听函数,当DOM结构加载完成的时候执行 $(function(){ }) //以上代码和下面的效果是一样的 $(document).ready(function(){ ...//代码 }) 6 jQuery(jQuery object) 当传进去的参数是一个jQuery对象的时候,则创建该jQuery对象的一个副本并返回。副本与传入的jQuery对象引用完全相同的元素 var aLi=$('li'); var copyLi=$(aLi);//创建一个aLi的副本 console.log(aLi); console.log(copyLi); console.log(copyLi===aLi); 图片描述 7 jQuery() 如果不传入任何的参数,则返回一个空的jQuery对象,属性length为0 注意这个功能可以用来复用jQuery对象,例如可以创建一个空的jQuery对象,然后在需要的时候先手动修改其中的元素,然后在调用jQuery方法。从而避免重复创建jQuery对象。

问问小秘 2020-04-29 16:39:03 0 浏览量 回答数 0

万券齐发助力企业上云,爆款产品低至2.2折起!

限量神券最高减1000,抢完即止!云服务器ECS新用户首购低至0.95折!

问题

Java读取文件问题:报错

kun坤 2020-06-08 17:32:49 1 浏览量 回答数 1

问题

如何用Ajax传递一个对象集合到jsp页面。

杨冬芳 2019-12-01 20:16:11 1391 浏览量 回答数 1

回答

概述 这个函数接收一个包含 CSS 选择器的字符串,然后用这个字符串去匹配一组元素。 jQuery 的核心功能都是通过这个函数实现的。 jQuery中的一切都基于这个函数,或者说都是在以某种方式使用这个函数。这个函数最基本的用法就是向它传递一个表达式(通常由 CSS 选择器组成),然后根据这个表达式来查找所有匹配的元素。 默认情况下, 如果没有指定context参数,$()将在当前的 HTML document中查找 DOM 元素;如果指定了 context 参数,如一个 DOM 元素集或 jQuery 对象,那就会在这个 context 中查找。在jQuery 1.3.2以后,其返回的元素顺序等同于在context中出现的先后顺序。 参考文档中 选择器 部分获取更多用于 expression 参数的 CSS 语法的信息。 参数 selector,[context]String,Element,/jQueryV1.0selector:用来查找的字符串 context:作为待查找的 DOM 元素集、文档或 jQuery 对象。 elementElementV1.0一个用于封装成jQuery对象的DOM元素 objectobjectV1.0一个用于封装成jQuery对象 elementArrayElementV1.0一个用于封装成jQuery对象的DOM元素数组。 jQuery objectobjectV1.0一个用于克隆的jQuery对象。 jQuery()V1.4返回一个空的jQuery对象。 示例 描述:找到所有 p 元素,并且这些元素都必须是 div 元素的子元素。 jQuery 代码:$("div > p");描述:设置页面背景色。 jQuery 代码:$(document.body).css( "background", "black" );描述:隐藏一个表单中所有元素。 jQuery 代码:$(myForm.elements).hide()描述:在文档的第一个表单中,查找所有的单选按钮(即: type 值为 radio 的 input 元素)。 jQuery 代码:$("input:radio", document.forms[0]);描述:在一个由 AJAX 返回的 XML 文档中,查找所有的 div 元素。 jQuery 代码:$("div", xml.responseXML);

a123456678 2019-12-02 03:09:12 0 浏览量 回答数 0

回答

你需要了解下dom的加载方式:可以用setTimeout 模拟加载会出项闪屏的效果,体验不是很好也可以用 onload文档外部资源不是很多的时候可以用,当有大量的页面的时候,我们必须等待所有的内容加载完了,用户体验不是很好(指示页面包含图片等文件在内的所有元素都加载完成)如:原生onload实现`window.onload = function(){}jQuery的实现方法$(window).load(function() {// including all frames, objects and images });`DOMready 成了我们最终的选择原理: 在页面的dom树创建完成后(也就是HTML解析第一步完成)即触发,而无需等待其他的资源的加载,但有分为如下两种情况:支持DOMContentLoaded事件的DOMContentLoaded事件:当页面中的文档树解析完成时,在页面的Document对象上,会触发DOMContentLoaded事件.该事件代表了,页面的DOM树已经构建完成,但页面引用的样式表和图像文件,以及包含的框架页面可能还没有加载完成,在页面完全加载完成时,会触发另外一个类似的称为"load"的事件.不支持的,就用Diego Perini 的hack 兼容。其兼容原理大概就是通过IE的document.documentElement.doScroll('left')来判断DOM树是否创建完毕如 jQuery实现方法`$(document).ready(function() {});`

小旋风柴进 2019-12-02 02:26:24 0 浏览量 回答数 0

回答

1.代码规范 其中width="300px" height="300px"这种写法是不符合w3c规范的,用 The W3C Markup Validation Service 检测会报错。属性width、height的值是个非负数,直接写数字即可,如width="300" 2.width是img公认的(非自定义的)特性,会以属性的形式添加到DOM对象中,所以可以通过dom.attr的形式去操作属性值。 imgDom.width = value;//此处的value是个number类型的非负值,若value为其他值时,转化为0console.log(typeof imgDom.width)//为number类型 document.getElementById("iImg").width=600; //方式①,结果为 width="600"; 赋值成功 document.getElementById("iImg").width="600px";//结果为 width="0" 赋值失败 因为width是img的属性,所以当然也可以用下面这种形式赋值: document.getElementById("iImg").setAttribute("width", "600");//方式② 3.方式①②是通过改变img的属性值来改变图片的大小,也可以通过改变css样式来改变图片的大小,当两者同时改变,谁又占上风呢? document.getElementById("iImg").style.width='600px';//方式③,这个是带px的,图片width渲染成功document.getElementById("iImg").width=900;//只改变属性值,但不影响图片的大小 综上,如果只是改变图片显示的大小,可以使用上述三种方式来达到目的,当有css样式来控制图片大小的时候,属性值的改变不影响图片的实际渲染尺寸: document.getElementById("iImg").width=600;//方式①,通过改变属性值来改变图片大小document.getElementById("iImg").setAttribute("width", "600");//方式②,通过改变属性值来改变图片大小document.getElementById("iImg").style.width='600px';//方式③,通过css样式来改变图片大小 补充:方式①和方式②的区别当属性为自定义属性时,dom.attr的方式失效,如: SegmentFault document.getElementById("test").width; //undefineddocument.getElementById("test").width = 1200; //无效document.getElementById("div").setAttribute("width", "1200");//只能通过这种方式改变属性width的值,但不管怎么改变,都不会影响div的宽度值,因为width只是div的一个自定义属性

杨冬芳 2019-12-02 02:55:08 0 浏览量 回答数 0

回答

$ 我们经常使用向 $ 内传入一个字符串的方式来选择或生成 DOM 元素,但如果这个字符串是来自用户输入的话,那么这种方式就是有风险的。 先看一个 DEMO: http://jsbin.com/duwuzonife/1/edit?html,js,output $("<img src='' onerror='alert();'>"); 当用户输入的字符串是像这样的时,虽然这个 <img> 元素不会马上被插入到网页的 DOM 中,但这个 DOM 元素已经被创建了,并且暂存在内存里。而对于 <img> 元素,只要设置了它的 src 属性,浏览器就会马上请求 src 属性所指向的资源。我们也可以利用这个特性做图片的预加载。在上面的示例代码中,创建元素的同时,也设置了它的属性,包括 src 属性和 onerror 事件监听器,所以浏览器会马上请求图片资源,显然请求不到,随机触发 onerror 的回调函数,也就执行了 JavaScript 代码。 推荐阅读 $ 的官方文档: http://api.jquery.com/jQuery/ 类似的其他方法 .after() .append() .appendTo() .before() .html() .insertAfter() .insertBefore() .prepend() .prependTo() .replaceAll() .replaceWith() .unwrap() .wrap() .wrapAll() .wrapInner() .prepend() 以上这些方法不仅创建 DOM 元素,并且会马上插入到页面的 DOM 树中。如果使用 <script> 标签插入了内联 JS 会立即执行。 不安全的输入来源 document.URL * document.location.pathname * document.location.href * document.location.search * document.location.hash document.referrer * window.name document.cookie document 的大多数属性都可以通过全局的 window 对象访问到。加 * 的属性返回的时编码 (urlencode) 后的字符串,需要解码才可能造成威胁。 不安全的操作 把可以被用户编辑的字符串,用在以下场景中,都是有隐患的。总体来说,任何把字符串作为可执行的代码的操作,都是不安全的。 1.通过字符串创建函数 (1)eval (2)new Function (3)setTimeout/setInterval 2.跳转页面 location.replace/location.assign 修改 <script> 标签的 src 属性 修改事件监听器 总结 如果发生在用 jQuery 时被 DOM-XSS 攻击的情况,大多是因为忽视了两个东西: 1. 在给$传参数时,对参数来源的把控。 2. 用户的输入途径不只有表单,还有地址栏,还可以通过开发者工具直接修改 DOM ,或者直接在控制台执行 JS 代码。 答案来源网络,供参考,希望对您有帮助

问问小秘 2019-12-02 03:05:01 0 浏览量 回答数 0

回答

要判断这个 CSS 文件是否加载完毕,各个浏览器的做法差异比较大,这次要说IE浏览器做的不错,我们可以直接通过onload方法来处理CSS加载完成以后的处理: 代码如下 复制代码 // 代码节选至seajsfunction styleOnload(node, callback) { // for IE6-9 and Opera if (node.attachEvent) { node.attachEvent('onload', callback); // NOTICE: // 1. "onload" will be fired in IE6-9 when the file is 404, but in // this situation, Opera does nothing, so fallback to timeout. // 2. "onerror" doesn't fire in any browsers! } } 很遗憾,这次在其他的浏览器中,想判断CSS是否加载完成就不是那么方便了,FF,webkit可以通过node.sheet.cssRules属性是否存在来判断是否加载完毕。而且需要使用setTimeout间隔事件轮询: 代码如下 复制代码 // 代码节选至seajs function poll(node, callback) { if (callback.isCalled) { return; } var isLoaded = false; if (/webkit/i.test(navigator.userAgent)) {//webkit if (node['sheet']) { isLoaded = true; } } // for Firefox else if (node['sheet']) { try { if (node['sheet'].cssRules) { isLoaded = true; } } catch (ex) { // NS_ERROR_DOM_SECURITY_ERR if (ex.code === 1000) { isLoaded = true; } } } if (isLoaded) { // give time to render. setTimeout(function() { callback(); }, 1); } else { setTimeout(function() { poll(node, callback); }, 1); } } setTimeout(function() { poll(node, callback); }, 0); SeaJS给出的完整的处理是这样的: 代码如下 复制代码 function styleOnload(node, callback) { // for IE6-9 and Opera if (node.attachEvent) { node.attachEvent('onload', callback); // NOTICE: // 1. "onload" will be fired in IE6-9 when the file is 404, but in // this situation, Opera does nothing, so fallback to timeout. // 2. "onerror" doesn't fire in any browsers! } // polling for Firefox, Chrome, Safari else { setTimeout(function() { poll(node, callback); }, 0); // for cache } } function poll(node, callback) { if (callback.isCalled) { return; } var isLoaded = false; if (/webkit/i.test(navigator.userAgent)) {//webkit if (node['sheet']) { isLoaded = true; } } // for Firefox else if (node['sheet']) { try { if (node['sheet'].cssRules) { isLoaded = true; } } catch (ex) { // NS_ERROR_DOM_SECURITY_ERR if (ex.code === 1000) { isLoaded = true; } } } if (isLoaded) { // give time to render. setTimeout(function() { callback(); }, 1); } else { setTimeout(function() { poll(node, callback); }, 1); } } // 我的动态创建LINK函数function createLink(cssURL,lnkId,charset,media){ var head = document.getElementsByTagName('head')[0], linkTag = null; if(!cssURL){ return false; } linkTag = document.createElement('link'); linkTag.setAttribute('id',(lnkId || 'dynamic-style')); linkTag.setAttribute('rel','stylesheet'); linkTag.setAttribute('charset',(charset || 'utf-8')); linkTag.setAttribute('media',(media||'all')); linkTag.setAttribute('type','text/css'); linkTag.href = cssURL; head.appendChild(linkTag); } function loadcss(){ var styleNode = createLink('/wp-content/themes/BlueNight/style.css'); styleOnload(styleNode,function(){ alert("loaded"); }); } 在看到seajs的代码的时候,我立刻想起了我看到Diego Perini的另一个解决方案: 代码如下 复制代码 /* Copyright (C) 2010 Diego Perini All rights reserved.* cssready.js - CSS loaded/ready state notification* Author: Diego Perini Version: 0.1 Created: 20100616 Release: 20101104* License: http://www.111cn.net * Download: http://javascript.nwbox.com/cssready/cssready.js*/ function cssReady(fn, link) { var d = document, t = d.createStyleSheet, r = t ? 'rules' : 'cssRules', s = t ? 'styleSheet' : 'sheet', l = d.getElementsByTagName('link'); // passed link or last link node link || (link = l[l.length - 1]); function check() { try { return link && link[s] && link[s][r] && link[s][r][0]; } catch(e) { return false; } } (function poll() { check() && setTimeout(fn, 0) || setTimeout(poll, 100); })(); } 其实,如果你读过jQuery的domready事件的判断的代码,原理也类似。也是通过setTimeout轮询的方式来判断DOM节点是否加载完毕。 还有,Fackbook则是通过在动态创建的CSS样式中包含一个固定的样式,例如#loadcssdom,loadcssdom就是一个高度为1px样式。然后动态创建一个DOM对象,添加这个loadcssdom样式。然后也是setTimeout轮询loadcssdo是否已经有1px的高度了。这个处理方式的解决方案,大家可以下《CSSP: Loading CSS with Javascript – and getting an onload callback.》 而《JavaScript Patterns》的作者Stoyan则在他的博客里,比较详细的说明了《When is a stylesheet really loaded?》。 看完了这些,你可能会感叹:汗,判断CSS是否加载完毕,目前还真不是那么容易!其实我这里算是一个抛砖引玉,因为开发中,除了动态加载CSS,我们还要动态加载JavaScript,动态加载HTML的操作,有空我也会写关于动态加载JavaScript的相关内容,不过在那之前,我建议你看看这些: 《ensure – Ensure JavaScripts/HTML/CSS are loaded on-demand when needed》,这个库是专门处理动态加载HTML,CSS,JavaScript的。就像作者介绍的那样: ensure is a tiny JavaScript library that provides a handy function ensure which allows you to load JavaScript, HTML, CSS on-demand, and then execute your code. ensure www.111cn.net ensures that the relevant JavaScript and HTML snippets are already in the browser DOM before executing your code that uses them. 《Tell CSS that JavaScript is available ASAP》 看完这个后,你可能就不会纠结:When you’re styling parts of a web page that will look and work differently depending on whether JavaScript is available or not。 好了,这次就说这么多了,希望对对大家的开发和学习有帮助!来源网络

元芳啊 2019-12-02 00:54:41 0 浏览量 回答数 0

回答

jquery获得的是一个类数组对象,含有一个或多个dom元素,要获得一个dom元素的话,你可以通过下面两种方法:1.$( "#foo" )[ 0 ]; // Equivalent to document.getElementById( "foo" )2.使用.get()函数。 $( "#foo" ).get( 0 ); // Identical to above, only slower.

小旋风柴进 2019-12-02 02:22:39 0 浏览量 回答数 0

回答

一、类数组对象定义:拥有length属性,其它属性(索引)为非负整数不具有数组所具有的方法 常见的类数组有arguments和NodeList,《javascript权威指南》里面给出了一个鉴别对象是否是类数组的函数:// Determine if o is an array-like object.// Strings and functions have numeric length properties, but are // excluded by the typeof test. In client-side JavaScript, DOM text// nodes have a numeric length property, and may need to be excluded // with an additional o.nodeType != 3 test.function isArrayLike(o) {if (o && // o is not null, undefined, etc. typeof o === 'object' && // o is an object isFinite(o.length) && // o.length is a finite number o.length >= 0 && // o.length is non-negative o.length===Math.floor(o.length) && // o.length is an integer o.length < 4294967296) // o.length < 2^32 return true; // Then o is array-like else return false; // Otherwise it is not}二、类数组转换为数组的方法1、Array.prototype.slice.call() 这种方法是借用了数组原型中的slice方法,返回一个数组。slice方法的内部实现:Array.prototype.slice = function(start,end){ var result = new Array(); start = start || 0; end = end || this.length; //使用call之后this指向了类数组对象 for(var i = start; i < end; i++){ result.push(this[i]); } return result; } 一个通用的转换函数:var toArray = function(s){try{ return Array.prototype.slice.call(s); } catch(e){ var arr = []; for(var i = 0,len = s.length; i < len; i++){ arr[i] = s[i]; } return arr; } 2、Array.from() Array.from()是ES6中新增的方法,可以将两类对象转为真正的数组:类数组对象和可遍历(iterable)对象(包括ES6新增的数据结构Set和Map)。var arrayLike = {'0':'a', '1':'b', '2':'c', length:3};var arr = Array.from(arrayLike);//['a','b','c']//把NodeList对象转换为数组,然后使用数组的forEach方法var ps = document.querySelectorAll('p');Array.from(ps).forEach(p){console.log(p);}); //转换arguments对象为数组function foo(){var args = Array.from(arguments); //...}//只要是部署了Iterator接口的数据结构,Array.from都能将其转换为数组Array.from('hello'); //['h','e','l','l','o']3、扩展运算符(…) 同样是ES6中新增的内容,扩展运算符(…)也可以将某些数据结构转为数组//arguments对象的转换function foo(){var args = [...arguments];}//NodeList对象的转换[...document.querySelectorAll('p')]扩展运算符实际上调用的是遍历器接口,如果一个对象没有部署此接口就无法完成转换ps:来源网络

元芳啊 2019-12-02 00:54:50 0 浏览量 回答数 0

问题

Java 处理 XML 的三种主流技术及介绍:报错

kun坤 2020-06-09 23:26:43 0 浏览量 回答数 1

回答

function.call/apply来更改tihs指向jquery绑定的事件this默认就是当前事件dom对象。如果你要获取点击的元素,可以给document添加click事件,通过事件参数e.target得到当前点击的对象$(document).click(function(e){console.log(e.target)})

吴孟桥 2019-12-02 02:34:20 0 浏览量 回答数 0

回答

// event(事件)工具集,来源:github.com/markyun markyun.Event = { // 页面加载完成后 readyEvent : function(fn) { if (fn==null) { fn=document; } var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = fn; } else { window.onload = function() { oldonload(); fn(); }; } }, // 视能力分别使用dom0||dom2||IE方式 来绑定事件 // 参数: 操作的元素,事件名称 ,事件处理程序 addEvent : function(element, type, handler) { if (element.addEventListener) { //事件类型、需要执行的函数、是否捕捉 element.addEventListener(type, handler, false); } else if (element.attachEvent) { element.attachEvent('on' + type, function() { handler.call(element); }); } else { element['on' + type] = handler; } }, // 移除事件 removeEvent : function(element, type, handler) { if (element.removeEnentListener) { element.removeEnentListener(type, handler, false); } else if (element.datachEvent) { element.detachEvent('on' + type, handler); } else { element['on' + type] = null; } }, // 阻止事件 (主要是事件冒泡,因为IE不支持事件捕获) stopPropagation : function(ev) { if (ev.stopPropagation) { ev.stopPropagation(); } else { ev.cancelBubble = true; } }, // 取消事件的默认行为 preventDefault : function(event) { if (event.preventDefault) { event.preventDefault(); } else { event.returnValue = false; } }, // 获取事件目标 getTarget : function(event) { return event.target || event.srcElement; }, // 获取event对象的引用,取到事件的所有信息,确保随时能使用event; getEvent : function(e) { var ev = e || window.event; if (!ev) { var c = this.getEvent.caller; while (c) { ev = c.arguments[0]; if (ev && Event == ev.constructor) { break; } c = c.caller; } } return ev; } };

景凌凯 2020-04-03 22:09:18 0 浏览量 回答数 0

回答

Java代码 收藏代码 import java.io.StringReader; import java.io.StringWriter; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import java.util.Map.Entry; import javax.xml.bind.JAXBContext; import javax.xml.bind.JAXBException; import javax.xml.bind.annotation.XmlAccessType; import javax.xml.bind.annotation.XmlAccessorType; import javax.xml.bind.annotation.XmlElement; import javax.xml.bind.annotation.XmlRootElement; import javax.xml.bind.annotation.adapters.XmlAdapter; import javax.xml.bind.annotation.adapters.XmlJavaTypeAdapter; import javax.xml.parsers.DocumentBuilder; import javax.xml.parsers.DocumentBuilderFactory; import org.w3c.dom.Document; import org.w3c.dom.Element; import org.w3c.dom.Node; import org.w3c.dom.NodeList; @XmlRootElement(name = "user") @XmlAccessorType(XmlAccessType.FIELD) public class User { /** * *JAXB XML适配器 * */ public static class UserRowsXmlAdapter extends XmlAdapter<Object, List<Map<String, String>>> { /** * 把 JAVA转化成ELEMENT对象 */ @Override public Object marshal(List<Map<String, String>> rows) throws Exception { DocumentBuilderFactory dbf = DocumentBuilderFactory.newInstance(); DocumentBuilder db = dbf.newDocumentBuilder(); Document document = db.newDocument(); Element rootElement = document.createElement("myrows");// 这里名字随便,以外面为准,JAXB会自动替换名字的 document.appendChild(rootElement); for (Map<String, String> row : rows) { Element rowEle = document.createElement("row"); Element idEle = document.createElement("id"); Element nameEle = document.createElement("name"); Entry<String, String> entry = row.entrySet().iterator().next();// 第一个ENTRY String id = entry.getKey();// ID String name = entry.getValue();// NAME idEle.setTextContent(id); nameEle.setTextContent(name); rowEle.appendChild(idEle); rowEle.appendChild(nameEle); rootElement.appendChild(rowEle); } return rootElement; } /** * 把XML ELEMENT转化成JAVA对象 */ @Override public List<Map<String, String>> unmarshal(Object rowsElement) throws Exception { if (rowsElement == null) { return null; } Element rowsEle = (Element) rowsElement; NodeList rowNodes = rowsEle.getChildNodes(); int rowCount = (rowNodes == null ? 0 : rowNodes.getLength()); if (rowCount == 0) { return null; } List<Map<String, String>> result = new ArrayList<Map<String, String>>( rowCount); for (int i = 0; i < rowCount; i++) { Node rowNode = rowNodes.item(i); if (!"row".equals(rowNode.getNodeName())) { System.out.println("发现非法节点:" + rowNode.getNodeName() + "忽略."); continue; } NodeList idNameNodes = rowNode.getChildNodes(); int nodeSize = (idNameNodes == null ? 0 : idNameNodes .getLength()); if (nodeSize == 0) { continue; } Map<String, String> row = new HashMap<String, String>(); String id = null; String name = null; for (int j = 0; j < nodeSize; j++) { Node node = idNameNodes.item(j); String nodeName = node.getNodeName(); String nodeValue = node.getTextContent(); if ("id".equals(nodeName)) { id = nodeValue; } else if ("name".equals(nodeName)) { name = nodeValue; } if (id != null && name != null) { break; } } if (id != null) { row.put(id, name); } else { System.out.println("未在row节点里发现id节点,忽略."); } result.add(row); } return result; } } @XmlElement(name="count") private int count; @XmlElement(name="rows") @XmlJavaTypeAdapter(UserRowsXmlAdapter.class) private List<Map<String, String>> rows; public int getCount() { return count; } public void setCount(int count) { this.count = count; } public List<Map<String, String>> getRows() { return rows; } public void setRows(List<Map<String, String>> rows) { this.rows = rows; } @Override public String toString() { return "User [count=" + count + ", rows=" + rows + "]"; } public static void main(String[] args) throws JAXBException { User u = new User(); List<Map<String, String>> rows = new ArrayList<Map<String, String>>(2); Map<String, String> row = new HashMap<String, String>(); row.put("1", "土豆");// userid=1,username=土豆 rows.add(row); row = new HashMap<String, String>(); row.put("2", "洋葱");// userid=2,username=洋葱 rows.add(row); u.setCount(rows.size()); u.setRows(rows); JAXBContext jc = JAXBContext.newInstance(User.class); StringWriter writer = new StringWriter(); jc.createMarshaller().marshal(u, writer); System.out.println("Marshalled xml==>"); System.out.println(writer); String xml = "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\"?>" + "<user><count>2</count><rows><row><id>1</id><name>土豆</name>" + "</row><row><id>2</id><name>洋葱</name>" + "</row></rows></user>"; User newu = (User) jc.createUnmarshaller().unmarshal( new StringReader(xml)); System.out.println("UnMarshalled user==>"); System.out.println(newu); } } 输出结果: Java代码 收藏代码 Marshalled xml==> <?xml version="1.0" encoding="UTF-8" standalone="yes"?><user><count>2</count><rows><row><id>1</id><name>土豆</name></row><row><id>2</id><name>洋葱</name></row></rows></user> UnMarshalled user==> User [count=2, rows=[{1=土豆}, {2=洋葱}]]

长安归故里. 2020-01-07 21:04:07 0 浏览量 回答数 0

回答

// event(事件)工具集,来源:https://github.com/markyun markyun.Event = { // 页面加载完成后 readyEvent: function(fn) { if (fn == null) { fn = document; } var oldonload = window.onload; if (typeof window.onload != "function") { window.onload = fn; } else { window.onload = function() { oldonload(); fn(); }; } }, // 视能力分别使用dom0||dom2||IE方式 来绑定事件 // 参数: 操作的元素,事件名称 ,事件处理程序 addEvent: function(element, type, handler) { if (element.addEventListener) { //事件类型、需要执行的函数、是否捕捉 element.addEventListener(type, handler, false); } else if (element.attachEvent) { element.attachEvent("on" + type, function() { handler.call(element); }); } else { element["on" + type] = handler; } }, // 移除事件 removeEvent: function(element, type, handler) { if (element.removeEnentListener) { element.removeEnentListener(type, handler, false); } else if (element.datachEvent) { element.detachEvent("on" + type, handler); } else { element["on" + type] = null; } }, // 阻止事件 (主要是事件冒泡,因为IE不支持事件捕获) stopPropagation: function(ev) { if (ev.stopPropagation) { ev.stopPropagation(); } else { ev.cancelBubble = true; } }, // 取消事件的默认行为 preventDefault: function(event) { if (event.preventDefault) { event.preventDefault(); } else { event.returnValue = false; } }, // 获取事件目标 getTarget: function(event) { return event.target || event.srcElement; }, // 获取event对象的引用,取到事件的所有信息,确保随时能使用event; getEvent: function(e) { var ev = e || window.event; if (!ev) { var c = this.getEvent.caller; while (c) { ev = c.arguments[0]; if (ev && Event == ev.constructor) { break; } c = c.caller; } } return ev; } };

kun坤 2019-12-02 03:23:05 0 浏览量 回答数 0

回答

js中有三种获取dom的方法: 根据ID获取对象:document.getElementById(ID); 根据tag获取对象数组:document.getElementsByTagName("p"); 根据name获取对象数组:document.getElementsByName(NAME);

viacc 2019-12-02 00:53:36 0 浏览量 回答数 0

回答

Zepto 对象 不能自定义事件 例如执行: $({}).bind('cust', function(){}); 结果: TypeError: Object has no method 'addEventListener' 解决办法是创建一个脱离文档流的节点作为事件对象: 例如: $('').bind('cust', function(){}); Zepto 的选择器表达式: [name=value] 中 value 必须用 双引号 " or 单引号 ' 括起来 例如执行:$('[data-userid=123123123]') 结果:Error: SyntaxError: DOM Exception 12 解决办法: $('[data-userid="123123123]"') or \$("[data-userid='123123123']") 2-1.zepto 的选择器没有办法选出 \$("div[name!='abc']") 的元素 2-2.zepto获取select元素的选中option不能用类似jq的方法$('option[selected]'),因为selected属性不是css的标准属性 应该使用$('option').not(function(){ return !this.selected }) 比如:jq:$this.find('option[selected]').attr('data-v') * 1 zepto:$this.find('option').not(function() {return !this.selected}).attr('data-v') * 1 但是获取有select中含有disabled属性的元素可以用 $this.find("option:not(:disabled)") 因为disabled是标准属性 参考网址:https://github.com/madrobby/zepto/issues/503 2-3、zepto在操作dom的selected和checked属性时尽量使用prop方法 Zepto 是根据标准浏览器写的,所以对于节点尺寸的方法只提供 width() 和 height(),省去了 innerWidth(), innerHeight(),outerWidth(),outerHeight() Zepto.js: 由盒模型( box-sizing )决定 jQery: 忽略盒模型,始终返回内容区域的宽/高(不包含 padding 、 border )解决方式就是使用 .css('width') 而不是 .width() 。 3-1.边框三角形宽高的获取 假设用下面的 HTML 和 CSS 画了一个小三角形: <div class="caret" > </div > .caret { width: 0; height: 0; border-width: 0 20px 20px; border-color: transparent transparent blue; border-style: none dotted solid; } jQuery 使用 .width() 和 .css('width') 都返回 ,高度也一样; Zepto 使用 .width() 返回 ,使用 .css('width') 返回 0px 。 所以,这种场景,jQuery 使用 .outerWidth() / .outerHeight() ;Zepto 使用 .width() / .height() 。 3-2.offset() Zepto.js: 返回 top 、 left 、 width 、 height jQuery: 返回 width 、 height 3-3.隐藏元素 Zepto.js: 无法获取宽高; jQuery: 可以获取。 Zepto 的 each 方法只能遍历 数组,不能遍历 JSON 对象 Zepto 的 animate 方法参数说明 :详情点击-> zepto 中 animate 的用法 zepto 的 jsonp callback 函数名无法自定义 DOM 操作区别 jq 代码: (function($) { $(function() { var $list = $("<ul><li>jQuery 插入</li></ul>", { id: "insert-by-jquery" }); $list.appendTo($("body")); }); })(window.jQuery); jQuery 操作 ul 上的 id 不会被添加。 zepto 代码: Zepto(function($) { var $list = $("<ul><li>Zepto 插入</li></ul>", { id: "insert-by-zepto" }); $list.appendTo($("body")); }); Zepto 可以在 ul 上添加 id 。 事件触发区别 jq 代码: (function($) { $(function() { $script = $("<script />", { src: "http://cdn.amazeui.org/amazeui/1.0.1/js/amazeui.min.js", id: "ui-jquery" }); $script.appendTo($("body")); $script.on("load", function() { console.log("jQ script loaded"); }); }); })(window.jQuery); 使用 jQuery 时 load 事件的处理函数 不会 执行 zepto 代码: Zepto(function($) { $script = $("<script />", { src: "http://cdn.amazeui.org/amazeui/1.0.1/js/amazeui.js", id: "ui-zepto" }); $script.appendTo($("body")); $script.on("load", function() { console.log("zepto script loaded"); }); }); 使用 Zepto 时 load 事件的处理函数 会 执行。 zepto 阻止事件冒泡 zepto 的 slideUP 和 slidedown 事件到底部才能触发 document.addEventListener( "touchmove", function(event) { event.preventDefault(); }, false );

茶什i 2019-12-02 03:21:22 0 浏览量 回答数 0

回答

我们从实际的应用来表达一下你的意思吧举个例子,有这样一堆li <ul class="list"> <li>Bootstrap</li> <li>jQuery</li> <li>gulp</li> <li>angular</li> </ul> 我希望点击每个li,都能够在控制台中输出li的内容,于是可以这样写 $(function() { $('.list').on('click', function(e) { console.log($(e.target).html()); }) }); 你运行试试看,效果已经达到了。这里运用了事件委托的思想,在点击时,使用 $(e.target)来判断被点击的对象其中 e.target是DOM对象,表示的是被点击的li,$(e.target)当然就是被点击那个li的jQuery对象了 也许在其他的一些应用场景中,你需要得到被点击li的序列,比如幻灯片切换效果的那一堆小按钮,除了在li中直接设置1,2,3,4之外,现在还流行一种做法,就是设置诸如data-item之类的属性值 整个例子的完整代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="js/jquery-2.0.3.js"></script> </head> <body> <ul class="list"> <li>Bootstrap</li> <li>jQuery</li> <li>gulp</li> <li>angular</li> </ul> </body> <script> $(function() { $('.list li').each(function(i) { $(this).attr('data-item', i); }) $('.list').on('click', function(e) { var $curLi = $(e.target); console.log($curLi.html()); //输出当前li的值 console.log($curLi.attr('data-item')); //输出当前li的序列 }) }); </script> </html>

小旋风柴进 2019-12-02 02:24:32 0 浏览量 回答数 0

回答

你是想拿去用还是想学习思想。一般而言,一个简单的编辑器基本上就是利用document.selection对象取得当前要编辑的文本内容,然后创造需要的DOM元素包裹它。例如你要插入一个图片,可以 <button onclick="insertImg()">插入图片</button> <div id="eidtor_view"></div> <textarea id="eidtor_edit"></div> function insertImg(){ var img = document.createElement("img"); img.style.width="100px"; img.style.height="100px"; img.setAttribute("src","default.jpg");//默认图片 document.getElementById("eidtor_edit")[0].innerText = img.outerHTML; //往编辑器里插字符 document.getElementById("eidtor")[0].appendChild(img);//往预览里面插入img元素 } 上面只是比较简单的例子,什么加粗,换行,还有加链接,都是利用document.selection对象取得当前光标选中的文字,放到各种生成的元素中。 这些都是dom-based类型的编辑器。还有一种是string-base的。就是直接拼接字符串。 大概的思想就是这些,毕竟一个好点的编辑器是比较复杂的工程。 文笔不好,只能大概说这么些,不足的请其他大牛给你补充。 顺便说下,segmentfault的markdown编辑器就是string-base的。编辑器器中的文本,被markdown.js或者后台的编译器(姑且这么叫下吧)根据markdown语法编译成html。

杨冬芳 2019-12-02 02:36:27 0 浏览量 回答数 0

回答

考量以下演示代码:let parent = document.body let child = document.createElement('div') child.addEventListener('click', clickHandler) parent.appendChild(child) 当我们移除 child 对象后: parent.removeChild(child)此时对于 DOM Tree 来说 child 当然是不存在的了,但是内存中依然有对于它的引用,也就是 child 本身,只不过它没有在 DOM Tree 中而已。因此,clickHandler 也同样驻留在内存中。当然了移除事件回调也不一定非要用 removeEventListener,像上例那种情况使用最简单的办法可以 child = null 即可。以上说的是最基本的情况,现实中其实要考虑很多因素。比如你说你做的是一个 SPA,那么假设你用了某种框架吧。现在的 SPA 基本上都会告诉你:如果你要做 DOM 操作,不要直接写在 Controller(或其他)地方,而是要写在组件(比如 Directive)里Basically,这么做的原因是框架的组件机制都会维护自身的生命周期,如果你要处理类似本问题中的“善后”工作,你可以利用这些生命周期来实现。框架会保障一些基本的东西,比如说判断 DOM Element 是否还存在于 DOM Tree 中,或者是否还有引用等等(一般来说,组件化有一个很大的好处就是 Isolation,也就是避免到处都是引用,因为人工判断和跟踪会很累很烦很容易出错)。老的浏览器存在很多 Bug,类似的“善后”工作可能要考虑的更细致和周全一些。

杨冬芳 2019-12-02 02:54:35 0 浏览量 回答数 0

问题

jquery中报Uncaught TypeError: pie is not a function

小旋风柴进 2019-12-01 20:27:39 2565 浏览量 回答数 1

回答

三种方法:1: 蓝色 </div> 2:元素对象事件监听 // 通过元素对象添加事件监听,元素对象可以是从DOM中查找的,也可以是创建的。 var btn=document.createElement("button"); btn.textContent="通过js添加的按钮"; document.body.appendChild(btn); 3,addEventListener// 元素对象的addEventListener方法,为元素添加一个事件监听。第一个参数是要监听的事件类型,第二个参数是事件函数,第三个参数可选,是否在冒泡捕获阶段监听,默认为false // 相比于前两种方法,这种方法可以为同一个元素的同一个事件添加多个事件函数。 outer.addEventListener("click",function(e){ console.log("outer捕获阶段"); },true);

景凌凯 2019-12-02 00:55:06 0 浏览量 回答数 0

回答

$() 这个方法完全体是这样的:jQuery([selector,[context]])第二个参数可选, 它是selector的查找范围, 如果未指定, 可以理解为查找范围就是document下面两个会查找到同样的dom集合:$('.parent .child') $('.child','.parent')这两个参数都可以接受字符串,dom元素,jquery对象作为参数。相关资料可以直接看jqueryAPI,核心方法第一个就是。

小旋风柴进 2019-12-02 02:27:07 0 浏览量 回答数 0

回答

varimgnew=document.getElementById("img1"); 这个地方不对,img还没有被添加到dom里面,是get不到的 回复 @小鱼吹泡泡:需要用代码放入dom,例如jq的insert和append之类的函数怎么才能得到呢,应该把这个获取对象的语句放在哪个位置?     varimg=newImage();//创建一个image对象    img.src="path.png";//指定img的src属性    img.id="id";//指定img的id    //以上三步创建了一个Image对象,但此对象并没有放到dom结构里    //它是独立存在的    window.onload=function(){        //将创建的Image对象添加到html的dom树里        document.body.appendChild(img);        //document.getElementById是从dom结构中查找指定id的节点        //但如果对象没有放置到dom树,显然是查找不到的        varmyImg=document.getElementById("id");        //如果上一步查找指定的id对象,而该对象不在dom结构里,则myImg为null        //下一步的alert中,由于myImg为null,对null采取属性获取,会报错        //但由于第一步已经将img放到了dom里,现在不会错了        alert(myImg.src);    }谢谢哈! 用代码来创建newimage好复杂啊!可不可以有第三方插件什么的来帮助 createnewimage ?跪求好的建议!谢谢!

爱吃鱼的程序员 2020-06-22 22:52:49 0 浏览量 回答数 0

问题

12个非常实用的JavaScript小技巧

技术小菜鸟 2019-12-01 21:37:52 3620 浏览量 回答数 1

回答

獲取的數據的格式沒問題么######没有问题,服务器端和本地数据库的字段都是一样的,关键是我用的是dom解析,而打印e.toString(),确实SAX解析错误,这一点很纠结啊?另外我想减小try块,但是总会出现错误######另外碰見這種情況debug調試撒,這樣解決問題就簡單多了###### 引用来自“程序員”的答案 獲取的數據的格式沒問題么 您看一下,在conn处提示有错误,请问怎样减小TRY块才不会出来这种错误啊? ###### 剛開了個會 這種情況 解析的文件格式不對是會報這個錯誤的 。。。。。把 URLConnection conn  = null ;放到上面  然後在Try 裡面 conn = url.openConnection() 就不會有問題了  ######我又试try/catch了几个语句,最后发现是doc = builder.parse(in);这一句导致的异常org.xml.sax.SAXParseException: name expected (position:START_TAG <null>@3:2 in java.io.InputStreamReader@405a8718),您能分析出来设施什么原因导致的吗?###### 引用来自“程序員”的答案 剛開了個會 這種情況 解析的文件格式不對是會報這個錯誤的 。。。。。把 URLConnection conn  = null ;放到上面  然後在Try 裡面 conn = url.openConnection() 就不會有問題了   // 更新本地数据库 private void updateTable1() { String urlStr = HttpUtil.BASE_URL + "servlet/UpdateServlet"; URLConnection conn = null ; InputStream in = null; DocumentBuilderFactory factory = null; DocumentBuilder builder = null; Document doc = null; Uri uri1 = null; ContentResolver cr = null; NodeList nl = null; try { URL url = new URL(urlStr); conn = url.openConnection(); in = conn.getInputStream(); factory = DocumentBuilderFactory.newInstance(); builder = factory.newDocumentBuilder(); doc = builder.parse(in); }catch (Exception e1) { System.out.println("e1.toString()"+e1.toString()); } try { //我逐步减小这个try块的大小,这种状态下打印出如下两种语句 nl = doc.getElementsByTagName("menu"); cr = getContentResolver(); Uri uri1 = Menus.CONTENT_URI; cr.delete(uri1, null, null); for (int i = 0; i < nl.getLength(); i++) { ContentValues values = new ContentValues(); // 解析XML文件获得菜单id int id = Integer.parseInt(doc.getElementsByTagName("id").item(i).getFirstChild().getNodeValue()); // 名称 String name = doc.getElementsByTagName("name").item(i).getFirstChild().getNodeValue(); // 图片路径 String pic = doc.getElementsByTagName("pic").item(i).getFirstChild().getNodeValue(); // 价格 int pri = Integer.parseInt(doc.getElementsByTagName("price").item(i).getFirstChild().getNodeValue()); // 添加到ContenValues对象 values.put("_id", id); values.put("name", name); values.put("pri", pri); values.put("pic", pic); // 插入到数据库 cr.insert(uri1, values); in.close(); } } catch (Exception e) { e.printStackTrace(); } } } 09-21 14:36:03.390: I/System.out(2610): e1.toString()org.xml.sax.SAXParseException: name expected (position:START_TAG <null>@3:2 in java.io.InputStreamReader@405a2f28) 09-21 14:36:03.390: I/System.out(2610): e2.toString()java.lang.NullPointerException,也就是说明执行的都是catch。 在try块从in = conn.getInputStream();位置下移到doc = builder.parse(in); 时,打印的都是I/System.out(2506): e2.toString()org.xml.sax.SAXParseException: name expected (position:START_TAG <null>@3:2 in java.io.InputStreamReader@405a8558) 这能说明什么问题吗?从这里可以分析出来是什么原因吗? ######後面的bug都是前面引起的,明顯一開始“ doc = builder.parse(in); ”的時候就有問題,######谢谢你啊,我在查查

kun坤 2020-06-07 00:22:28 0 浏览量 回答数 0

回答

跨域的话,无法操作里面的内容,因为浏览器处于安全性考虑,不允许这么做,如果是同域名的iframe,就可以操作,第一个答案就可以。######回复 @vcxiaohan : 问题解决了就好######回复 @zabcd117 : 我知道了,是window.onoload=function(){}的问题######回复 @vcxiaohan : 你确定一下$(window.frames["chat"].document).find('input').css({'background': 'red'}); 这个frames里面是用name还是id获取。还有一个问题就是,即使你获取到了这个frame的document对象,如果里面没有jq的话,不能用jq的方法,也就是后面的find和css是没有,先用原生。######同域名 不行啊###### document.getElementById('iframe的ID').contentWindow.document.getElementById('元素的ID') 不好用吗  ######var x = document.getElementById('qq').contentWindow.document.getElementById('div1'); console.log(x);//获得null######没用,请问有demo吗,给我研究下###### 这不就是dom元素操作么,w3c不是有么 http://www.w3school.com.cn/jsref/prop_iframe_src.asp

kun坤 2020-05-29 15:53:21 0 浏览量 回答数 0

回答

你的IE版本太低了,要IE10+ file对象才支持files属性,FormData也需要IE10+才支持。。你要先判断是否有files属性才使用[]操作符而且document.getElementById吧,哪来的document.getElementByIdx_x_x这个方法,搞错了 var fileObj=document.getElementById('file') if(!fileObj.files){alert('FILE DOM不支持files属性');return}

小旋风柴进 2019-12-02 02:08:51 0 浏览量 回答数 0
阿里云大学 云服务器ECS com域名 网站域名whois查询 开发者平台 小程序定制 小程序开发 国内短信套餐包 开发者技术与产品 云数据库 图像识别 开发者问答 阿里云建站 阿里云备案 云市场 万网 阿里云帮助文档 免费套餐 开发者工具 企业信息查询 小程序开发制作 视频内容分析 企业网站制作 视频集锦 代理记账服务 企业建站模板