Javascript条件查找/替换

时间:2013-10-21 22:06:42

标签: javascript

对于我的javascript项目,我有一个如下所示的列表:

<li id="1">101.33, "book name 1"</li>
<li id="2">600.01, book name 2</li>
<li id="3">001.11, book name 3</li>

etc...

其中我应该做以下事情:

  1. 将项目符号列表条目重新映射为新的(一致的)标记类型(您的选择 - 让它看起来很漂亮!)。
  2. 对于100到200之间的条目,将100添加到Dewey十进制数。
  3. 对于400到500之间的条目,将Dewey十进制数加200。
  4. 850到900之间的条目需要从杜威十进制数中删除100。
  5. 600到650之间的条目需要在杜威十进制数字中添加17个
  6. 对于要更改的项目,请将“已更改”附加到记录中。
  7. 对于未更改的项目,请在记录中附加“无更改”。
  8. 对于不正确的记录,请将“无效记录”附加到记录
  9. 但我不知道该怎么做。我想定位正文中的任何数字,或列表项目中的任何数字。现在我有这个:

    var z = document.body.li.innerHTML;
    if (z >+ 100 && z <= 200)
    {
    var q = z + 100;
    document.body.li.innerHTML=q;
    }
    
    }
    

    有人能指出我在javascript中执行此操作的最佳方法的正确方向吗?我应该使用find / replace吗?

    编辑:尝试修改David Thomas代码中的最后三元if else语句。似乎无法让它发挥作用:

    //define valid record number as at-least-one-integer.at-least-one-integer
    var reggie = /\d+(.)+d/
    
    if (_newText = reggie) {
    'Invalid Record';
    }
    else if (_newText === a[textProp]) {
    'no change';
    }
    else(_newText != a[textProp]) {
    'changed';
    }
    + ')';
    

3 个答案:

答案 0 :(得分:1)

一种方法,如下(使用纯JavaScript,尽管您需要使用最新的浏览器):

// first, we need to get all the 'li' items:

var lis = document.querySelectorAll('ul > li'),
    // find the relevant text-property for this browser:
    textProp = 'textContent' in document ? 'textContent' : 'innerText',
    // empty string variable to allow assessment of changes:
    _newText = '';

// Remap the bullet list entries to a new (consistent) tag type (your choice – make it look pretty!).
// do this one yourself.

// a function to zero-pad the numbers (I believe a requirement of Dewey Decimal):
function leftPadNumber(num, numLength, padChar) {
    var nString = num.toString(),
        major = parseInt(num, 10),
        minor = parseFloat(nString.substring(nString.indexOf('.'))),
        diff = numLength - major.toString().length;
    if (diff > 0) {
        return new Array(diff + 1).join(padChar || 0) + (major + minor);
    } else {
        return num;
    }

}

// For entries between 100 and 200, add 100 to the Dewey decimal number.
// For entries between 400 and 500, add 200 to the Dewey decimal number.
// Entries between 850 and 900 need to have 100 removed from the Dewey decimal number.
// Entries between 600 and 650 need to have 17 added to the Dewey decimal number

// note that I've taken a very literal interpretation of 'between' (amend if necessary):
function amendedDeweyDecimal(num) {
    if (num > 100 && num < 200) {
        num += 100;
    } else if (num > 400 && num < 500) {
        num += 200;
    } else if (num > 850 && num < 900) {
        num -= 100;
    } else if (num > 600 && num < 650) {
        num += 17;
    }
    // happens if num falls somewhere outside of the above constraints:
    return num;
}

// iterates over each element in the 'lis' nodeList/collection:
[].forEach.call(lis, function (a) {
    /* replaces the found numbers ('m') in the string, using the two
       functions, above, and assigns those to the _newText variable:
    _newText = a[textProp].replace(/(\d{3}\.\d{2})/, function (m) {
        return leftPadNumber(amendedDeweyDecimal(parseFloat(m)).toFixed(2), 3);
    });

    // For items that get changed, append “changed” to the record.
    // For items that do not get changed, append “no change” to the record.

    // returns the original text to the element, along with '(no change)'
    // (if 'a[textProp]' is exactly equal to '_newText') or with '(changed)'
    // (if the two variables are not identical):
    a[textProp] = _newText + ' (' + (_newText === a[textProp] ? 'no change' : 'changed') + ')';
});

// For records that are incorrect, append “invalid record” to the record
// I have absolutely no idea how to assess an 'incorrect' record.

JS Fiddle demo

参考文献:

答案 1 :(得分:0)

尝试jQuery .each

$('li').each(function(index, value) {
    var val = $(this).text().split(','); //split into array
    if (index >= 100 && index < 200) {
        //do stuff
    }
    if (index >= 400 && index < 500) {
        //do stuff
    }
    //etc
});

答案 2 :(得分:0)

无论你是想使用纯JavaScript还是帮助库(例如jQuery)来解决这个问题,我建议将你的问题反汇编成更小的任务并逐一解决。最后,他们将适合彼此,并将构建完整的解决方案。我会从三个简单的功能开始(阅读你的描述,他们将经常需要):

  • 分别列出所有LI元素的能力
  • 从LI内容中提取数字
  • 检查给定范围内的数字是否

代码可能如下所示:

// count of all LI items
var elements = 0; 
// fetch LI item one at a time
var element = document.getElementById(elements+1);
while (element != undefined) {
    // get the number
    var number = Number(getNumber(element.innerHTML));
    // do something with number and or LI element
    if (inRange(number, 100, 200)) { /* add 100 ...*/ } // and so on
    // go to next element
    elements++;
    element = document.getElementById(elements+1);
}

function getNumber(elementContent) {
    return elementContent.split(",")[0]; // TODO error handling
}

function inRange(number, min, max) {
    return (number >= min) && (number <= max);
}

您可以引入简单的对象和数组来存储信息和状态,以跟踪内容的变化。